:root{--brand:#2b4cff;--brand2:#7b3fe4;--accent:#ff9a1f;--pink:#ff4f8b;--green:#10b981;--teal:#06b6d4;--ink:#141b34;--ink2:#3b4565;--muted:#68728f;--line:#e4e7f2;--bg:#f6f7fe;--card:#fff;--ok:#12a150;--radius:20px;--max:1200px;
--grad:linear-gradient(120deg,#2b4cff 0%,#7b3fe4 55%,#ff4f8b 100%);--grad-warm:linear-gradient(120deg,#ff9a1f,#ff4f8b);--shadow:0 18px 50px #1d2a6b1f}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:16px/1.6 "DM Sans","Segoe UI",system-ui,sans-serif;color:var(--ink);background:var(--bg);overflow-x:hidden}
img{max-width:100%;height:auto;display:block}a{color:var(--brand)}
h1,h2,h3{font-family:Manrope,"Segoe UI",sans-serif;line-height:1.18;letter-spacing:-.5px;margin:0 0 .5em}
h1{font-size:clamp(30px,5vw,54px)}h2{font-size:clamp(26px,3.6vw,40px)}h3{font-size:20px}
p{margin:0 0 1em}.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.muted{color:var(--muted)}.small{font-size:14px}.center{text-align:center}
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
/* announcement bar */
.announce{background:var(--grad);color:#fff;font-size:14px;font-weight:700;text-align:center;padding:8px 44px 8px 16px;position:relative}
.announce a{color:#fff;text-decoration:none}.announce .new{display:inline-block;background:#fff;color:var(--brand2);border-radius:20px;padding:1px 9px;font-size:12px;margin-right:8px;animation:pulse 1.6s infinite}
.announce u{text-underline-offset:3px}
@media(max-width:700px){.announce{padding:7px 12px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
/* header */
.top{position:sticky;top:0;z-index:40;background:#ffffffeb;backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:18px;height:70px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font:800 23px Manrope,sans-serif}
.logo img{width:40px;height:40px;border-radius:12px;box-shadow:0 6px 16px #2b4cff33}.logo b{color:var(--accent)}
.nav{display:flex;gap:2px;margin-left:auto;align-items:center}
.nav a{text-decoration:none;color:var(--ink2);font-weight:700;font-size:15px;padding:8px 11px;border-radius:10px;position:relative}
.nav a:hover,.nav a.on{background:#eef0ff;color:var(--brand)}
.nav .badge{position:absolute;top:-4px;right:-6px;background:var(--pink);color:#fff;font-size:10px;line-height:1;padding:3px 5px;border-radius:8px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;font-weight:800;border-radius:14px;padding:13px 24px;border:2px solid transparent;cursor:pointer;font-size:16px;transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--grad);color:#fff;box-shadow:0 10px 24px #5b3fe43d}.btn-primary:hover{box-shadow:0 14px 30px #5b3fe455}
.btn-accent{background:var(--grad-warm);color:#fff;box-shadow:0 10px 24px #ff6a4f44}.btn-ghost{border-color:var(--brand);color:var(--brand);background:#fff}
.btn-wa{background:#1fa855;color:#fff}.btn-sm{padding:8px 14px;font-size:14px;border-radius:11px}
.btn-white{background:#fff;color:var(--ink)}
.menu-btn{display:none;margin-left:auto;background:none;border:0;font-size:28px;cursor:pointer;color:var(--ink)}
@media(max-width:980px){.menu-btn{display:block}.nav{display:none;position:absolute;top:70px;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;padding:10px 16px 16px;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}.nav.open{display:flex}.nav .badge{position:static;margin-left:6px}}
/* hero slider */
.slider{position:relative;overflow:hidden;color:#fff}
.slides{display:flex;transition:transform .6s cubic-bezier(.65,0,.35,1)}
.slide{min-width:100%;padding:56px 0 78px;position:relative;overflow:hidden}
.slide::before,.slide::after{content:"";position:absolute;border-radius:50%;background:#ffffff1f;pointer-events:none}
.slide::before{width:420px;height:420px;top:-160px;right:-120px}.slide::after{width:260px;height:260px;bottom:-120px;left:-80px;background:#ffffff14}
.slide .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;position:relative;z-index:1}
.s-blue{background:linear-gradient(125deg,#1f3bdb,#6a3fe0 60%,#b03fd8)}
.s-orange{background:linear-gradient(125deg,#ff7a18,#ff4f6d 60%,#d63384)}
.s-green{background:linear-gradient(125deg,#059669,#0ea5a4 55%,#2563eb)}
.s-violet{background:linear-gradient(125deg,#5b21b6,#7c3aed 50%,#2b4cff)}
.s-navy{background:linear-gradient(125deg,#0f172a,#1e3a8a 60%,#0e7490)}
.slide h1,.slide h2.h1{font-size:clamp(30px,4.6vw,52px);color:#fff;margin-bottom:.4em}
.slide p.lead{font-size:19px;color:#ffffffe0;max-width:620px}
.pill{display:inline-block;background:#ffffff26;border:1px solid #ffffff55;border-radius:30px;padding:6px 14px;font-weight:700;font-size:14px;margin-bottom:14px}
.slide .cta{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 12px}.slide .btn-ghost{background:transparent;color:#fff;border-color:#fff}
.trust{display:flex;gap:16px;flex-wrap:wrap;font-size:14px;color:#ffffffd9;margin-top:10px}.trust span::before{content:"✔ ";color:#a7f3d0}
.art{display:flex;justify-content:center;align-items:center;gap:16px;min-height:340px}
.phone{width:220px;border-radius:30px;background:#0b1024;padding:8px;box-shadow:0 30px 70px #00000059}.phone img{border-radius:23px}
.phone.tilt{transform:rotate(-6deg) translateY(24px);width:190px}
.laptop{width:100%;max-width:520px;background:#0b1024;border-radius:16px;padding:10px 10px 14px;box-shadow:0 30px 70px #00000059}.laptop img{border-radius:9px}
.float-chip{position:absolute;background:#fff;color:var(--ink);font-weight:800;font-size:14px;border-radius:14px;padding:9px 13px;box-shadow:0 14px 30px #0003;animation:bob 3s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-8px)}}
.art{position:relative}
.dots{position:absolute;bottom:22px;left:0;right:0;display:flex;justify-content:center;gap:9px;z-index:3}
.dots button{width:11px;height:11px;border-radius:10px;border:0;background:#ffffff80;cursor:pointer;padding:0;transition:width .3s}
.dots button.on{width:30px;background:#fff}
.arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:46px;height:46px;border-radius:50%;border:0;background:#ffffff2e;color:#fff;font-size:22px;cursor:pointer;backdrop-filter:blur(4px)}
.arrow:hover{background:#ffffff55}.arrow.prev{left:14px}.arrow.next{right:14px}
@media(max-width:900px){.slide .wrap{grid-template-columns:1fr;gap:18px}.art{min-height:0}.phone{width:180px}.phone.tilt{display:none}.arrow{display:none}.slide{padding:40px 0 70px}.float-chip{display:none}}
/* old static hero (inner use) */
.hero{background:var(--grad);color:#fff;padding:64px 0 72px;overflow:hidden}
/* stat strip */
.strip{margin-top:-34px;position:relative;z-index:5}
.strip .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.strip .it{background:#fff;border-radius:18px;padding:18px;box-shadow:var(--shadow);display:flex;gap:12px;align-items:center;font-weight:700}
.strip .it i{font-style:normal;font-size:26px;width:50px;height:50px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex:none}
.strip .it small{display:block;color:var(--muted);font-weight:500}
@media(max-width:900px){.strip .wrap{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.strip .it{padding:12px;font-size:14px}.strip .it i{width:40px;height:40px;font-size:20px}}
/* sections */
section{padding:72px 0}.alt{background:#fff}.sec-head{max-width:780px;margin:0 auto 40px;text-align:center}
.eyebrow{display:inline-block;font-weight:800;font-size:13px;letter-spacing:1.2px;text-transform:uppercase;color:var(--brand2);background:#f1ebff;border-radius:20px;padding:5px 13px;margin-bottom:12px}
.grid{display:grid;gap:20px}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.g2,.g3,.g4{grid-template-columns:1fr}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px;transition:transform .2s,box-shadow .2s;min-width:0}
.card .ico{font-size:28px;margin-bottom:12px;width:58px;height:58px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:#eef0ff}.card h3{margin-bottom:6px}
.fcards .card:hover,.biz:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.fcards .card{border-top:4px solid var(--c,#2b4cff)}.fcards .card .ico{background:var(--t,#eef0ff)}
.c1{--c:#2b4cff;--t:#e8ecff}.c2{--c:#ff9a1f;--t:#fff1df}.c3{--c:#10b981;--t:#dcfaef}.c4{--c:#7b3fe4;--t:#efe6ff}.c5{--c:#ff4f8b;--t:#ffe4ee}.c6{--c:#06b6d4;--t:#dcf7fc}.c7{--c:#eab308;--t:#fdf6d4}.c8{--c:#ef4444;--t:#fee2e2}
.split{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}.split.rev>:first-child{order:2}
@media(max-width:900px){.split{grid-template-columns:1fr}.split.rev>:first-child{order:0}}
.shot{border-radius:18px;border:1px solid var(--line);box-shadow:var(--shadow);background:#fff}
ul.ticks{list-style:none;padding:0;margin:0 0 1em}ul.ticks li{padding-left:30px;position:relative;margin:8px 0}ul.ticks li::before{content:"✓";position:absolute;left:0;top:2px;width:20px;height:20px;border-radius:50%;background:#dcfaef;color:var(--ok);font-weight:900;font-size:12px;display:flex;align-items:center;justify-content:center}
.biz{display:block;text-decoration:none;color:inherit}.biz:hover{border-color:var(--brand)}
.biz .ico{background:var(--t,#eef0ff)}
/* colourful band */
.band{background:var(--grad);color:#fff;position:relative;overflow:hidden}.band .muted,.band p{color:#ffffffd9}
.band::before{content:"";position:absolute;width:500px;height:500px;border-radius:50%;background:#ffffff14;top:-250px;left:-150px}
/* updates */
.upd{display:flex;gap:16px;align-items:flex-start}.upd .ico{flex:none;margin:0}
.upd-tag{display:inline-block;font-size:12px;font-weight:800;border-radius:8px;padding:2px 8px;background:#ffe4ee;color:#c2185b;margin-right:6px}
.timeline{position:relative;max-width:860px;margin:0 auto}.timeline::before{content:"";position:absolute;left:19px;top:6px;bottom:6px;width:3px;background:linear-gradient(#2b4cff,#ff4f8b);border-radius:3px}
.tl{position:relative;padding-left:58px;margin-bottom:26px}.tl::before{content:"";position:absolute;left:10px;top:6px;width:21px;height:21px;border-radius:50%;background:#fff;border:5px solid var(--brand2)}
.tl .card h3{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
/* videos */
.video{position:relative;padding-top:56.25%;border-radius:18px;overflow:hidden;background:#000 center/cover no-repeat;cursor:pointer;box-shadow:var(--shadow)}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video .play{position:absolute;inset:0;margin:auto;width:76px;height:54px;border-radius:16px;background:#ff0033;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px #0006;transition:transform .2s}
.video .play::before{content:"";border-style:solid;border-width:12px 0 12px 20px;border-color:transparent transparent transparent #fff;margin-left:4px}
.video:hover .play{transform:scale(1.1)}
.video .vt{position:absolute;left:0;right:0;bottom:0;padding:30px 16px 12px;background:linear-gradient(transparent,#000c);color:#fff;font-weight:800}
/* gallery */
.gallery{columns:4 220px;column-gap:16px}
.gallery a{display:block;margin:0 0 16px;break-inside:avoid;border-radius:16px;overflow:hidden;position:relative;box-shadow:0 8px 24px #1d2a6b14;background:#fff}
.gallery img{transition:transform .4s}.gallery a:hover img{transform:scale(1.05)}
.gallery a span{position:absolute;left:10px;bottom:10px;background:#000000a6;color:#fff;font-size:13px;font-weight:700;border-radius:9px;padding:3px 9px}
.lightbox{position:fixed;inset:0;background:#05081af0;z-index:100;display:none;align-items:center;justify-content:center;padding:20px;flex-direction:column;gap:10px}
.lightbox.open{display:flex}.lightbox img{max-height:84vh;max-width:94vw;width:auto;border-radius:12px}.lightbox p{color:#fff;margin:0;font-weight:700}
.lightbox button{position:absolute;top:14px;right:18px;background:#fff2;border:0;color:#fff;font-size:28px;width:48px;height:48px;border-radius:50%;cursor:pointer}
/* reviews slider */
.reviews{position:relative;overflow:hidden}
.rtrack{display:flex;gap:20px;transition:transform .6s ease}
.review{flex:0 0 calc((100% - 40px)/3);background:#fff;border-radius:22px;padding:26px;border:1px solid var(--line);box-shadow:0 10px 30px #1d2a6b12;display:flex;flex-direction:column}
.review .stars{color:#f5b301;font-size:18px;letter-spacing:2px}.review q{display:block;font-size:17px;margin:10px 0 18px;flex:1;quotes:"“" "”"}
.review .who{display:flex;gap:12px;align-items:center}.review .av{width:46px;height:46px;border-radius:50%;background:var(--grad);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:18px;flex:none}
.review .who small{display:block;color:var(--muted)}
.review.ask{background:var(--grad);color:#fff;border:0}.review.ask q{quotes:none}
.rnav{display:flex;justify-content:center;gap:10px;margin-top:24px}.rnav button{width:44px;height:44px;border-radius:50%;border:2px solid var(--line);background:#fff;font-size:18px;cursor:pointer}.rnav button:hover{border-color:var(--brand);color:var(--brand)}
@media(max-width:900px){.review{flex-basis:calc((100% - 20px)/2)}}@media(max-width:600px){.review{flex-basis:100%}}
/* pricing */
.tabs{display:flex;gap:8px;justify-content:center;margin-bottom:26px;flex-wrap:wrap}.tabs button{border:2px solid var(--line);background:#fff;border-radius:30px;padding:9px 20px;font-weight:800;cursor:pointer;font-size:15px;color:var(--ink)}.tabs button.on{background:var(--grad);color:#fff;border-color:transparent}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}@media(max-width:900px){.plans{grid-template-columns:1fr}}
.plan{background:#fff;border:2px solid var(--line);border-radius:24px;padding:28px;position:relative;display:flex;flex-direction:column;transition:transform .2s}
.plan:hover{transform:translateY(-4px)}
.plan.best{border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,var(--grad) border-box;box-shadow:0 22px 60px #5b3fe42e}.plan .tag{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--grad-warm);color:#fff;font-weight:800;font-size:13px;border-radius:20px;padding:4px 14px;white-space:nowrap}
.price{font:800 42px Manrope,sans-serif;color:var(--brand);margin:6px 0 0}.price small{font-size:15px;color:var(--muted);font-weight:600}
.plan ul{flex:1}.plan .btn{width:100%;margin-top:10px}
table.cmp{width:100%;border-collapse:collapse;background:#fff;border-radius:16px;overflow:hidden}table.cmp th,table.cmp td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;font-size:15px}table.cmp th{background:#eef0ff}table.cmp td.c{text-align:center}
/* faq */
details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:15px 18px;margin:10px 0}details summary{font-weight:800;cursor:pointer}details[open]{border-color:#c9cffc}
/* blog */
.post-list .card h3 a{text-decoration:none;color:var(--ink)}.post-list .card{border-top:4px solid var(--brand2)}.post-list .card.hi{border-top-color:var(--accent)}
.article{max-width:800px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:22px;padding:36px}
.article h2{font-size:26px;margin-top:1.4em}.article table{border-collapse:collapse;width:100%}.article td,.article th{border:1px solid var(--line);padding:8px}
.ad-slot{margin:22px 0;min-height:90px;display:flex;align-items:center;justify-content:center;border:1px dashed var(--line);border-radius:12px;color:var(--muted);font-size:13px}
/* forms */
.form{display:grid;gap:14px}.form label{display:flex;flex-direction:column;gap:5px;font-weight:700;font-size:15px}
.form input,.form select,.form textarea{border:2px solid var(--line);border-radius:12px;padding:11px 12px;font:inherit}.form input:focus{border-color:var(--brand);outline:0}
.notice{background:#fff7e8;border:1px solid #f3cf8a;border-radius:14px;padding:14px 16px}.notice.ok{background:#ecfbf2;border-color:#9fdcb6}
.key-box{font:15px Consolas,monospace;word-break:break-all;background:#0b1024;color:#d6ffe4;border-radius:12px;padding:16px}
/* footer */
.foot{background:#0b1024;color:#c3c9e0;padding:56px 0 22px;position:relative}.foot::before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:var(--grad)}
.foot a{color:#c3c9e0;text-decoration:none}.foot a:hover{color:#fff}
.foot .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:24px}@media(max-width:800px){.foot .cols{grid-template-columns:1fr 1fr}}
.foot h4{color:#fff;margin:0 0 10px}.foot ul{list-style:none;padding:0;margin:0}.foot li{margin:6px 0}.foot .legal{border-top:1px solid #222a4a;margin-top:30px;padding-top:16px;font-size:13px;color:#8b93b3}
.wa-float{position:fixed;right:18px;bottom:18px;width:58px;height:58px;border-radius:50%;background:#1fa855;color:#fff;display:flex;align-items:center;justify-content:center;font-size:30px;text-decoration:none;box-shadow:0 10px 26px #0005;z-index:30}
.page-hero{background:var(--grad);color:#fff;padding:54px 0;position:relative;overflow:hidden}.page-hero::after{content:"";position:absolute;width:380px;height:380px;border-radius:50%;background:#ffffff1a;right:-120px;top:-170px}
.page-hero .wrap{position:relative;z-index:1}.page-hero p{color:#ffffffe0;font-size:18px;max-width:760px}
.crumbs{font-size:14px;color:#e6e2ff;margin-bottom:8px}.crumbs a{color:#fff}
.prose{max-width:860px}.prose h2{margin-top:1.6em;font-size:24px}
.hi,.hi h1,.hi h2,.hi h3{font-family:'Noto Sans Devanagari','DM Sans',sans-serif}.article.hi{line-height:1.8}.lang-tag{display:inline-block;background:#eef0ff;color:var(--brand);font-weight:800;border-radius:8px;padding:1px 8px;margin-right:6px}.article hr{border:0;border-top:1px solid var(--line);margin:24px 0}
.nav a.btn-primary{color:#fff;background:var(--grad);margin-left:6px}.nav a.btn-primary:hover{color:#fff}
@media(max-width:600px){.article{padding:20px 16px}.article h1{font-size:26px!important}section{padding:50px 0}.slide p.lead{font-size:17px}}
@media(max-width:600px){table.cmp{display:block;overflow-x:auto;white-space:nowrap}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}