:root{--ink:#1a0f2e;--deep:#2a1450;--vio:#6b2c91;--mag:#922a8c;--lil:#d9c2f5;--coral:#f04f4e;--paper:#faf8fd;--line:#e6dff2}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}
body{font-family:Nunito,system-ui,sans-serif;color:var(--ink);background:var(--paper);line-height:1.6}
h1,h2,h3{font-family:Montserrat,Nunito,sans-serif;line-height:1.15}
a{color:inherit;text-decoration:none}img{max-width:100%;display:block}
.wrap{max-width:1180px;margin:auto;padding:0 20px}
header{position:sticky;top:0;z-index:50;background:#fffffff2;backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;height:74px}
.bar img{height:52px}nav{display:flex;gap:6px;align-items:center}
nav a{padding:8px 12px;border-radius:8px;font-weight:700;font-size:15px}nav a:hover,nav a.on{background:#f1e8fb;color:var(--mag)}
.btn{display:inline-block;padding:12px 22px;border-radius:999px;background:var(--coral);color:#fff;font-weight:800;border:0;cursor:pointer;font:800 15px Nunito;transition:transform .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px #f04f4e55}nav .btn{color:#fff}nav .btn:hover{background:var(--coral)}
.btn.ghost{background:transparent;border:2px solid #ffffff66}
.burger{display:none;background:none;border:0;font-size:28px;cursor:pointer}
.hero{background:radial-gradient(900px 500px at 15% 20%,#6b2c91 0,transparent 60%),linear-gradient(135deg,#1a0f2e,#3a1a6e);color:#fff;padding:56px 0 64px;overflow:hidden;position:relative}
.hero .wrap{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.hero h1{font-size:clamp(40px,5.5vw,68px);font-weight:800;letter-spacing:-1.5px}
.hero h1 span{display:block;font-size:.42em;font-weight:600;letter-spacing:0;color:var(--lil);margin-top:14px}
.hero p{max-width:520px;margin:20px 0 28px;color:#e8dcfa;font-size:18px}
.acts{display:flex;gap:12px;flex-wrap:wrap}
.meter{position:relative;max-width:460px;margin:auto;width:100%;padding:26px 22px 20px;border-radius:28px;background:#ffffff0f;border:1px solid #ffffff2a;box-shadow:0 30px 80px #0006,inset 0 0 40px #ffffff0a}
.meter svg{width:100%;overflow:visible}
.meter .val{position:absolute;left:0;right:0;top:50%;text-align:center;transform:translateY(-6%)}
.meter .val b{font:800 64px Montserrat;display:block;line-height:1}.meter .val small{color:var(--lil);font-weight:700}
.meter .st{display:flex;justify-content:space-between;font-size:14px;color:var(--lil);margin-top:6px;font-weight:700}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#4ade80;margin-right:6px;animation:pulse 1.2s infinite}
@keyframes pulse{50%{opacity:.25}}
.sect{padding:64px 0}.sect h2{font-size:clamp(28px,3.4vw,40px);margin-bottom:10px}.sub{color:#6a5d80;margin-bottom:30px;max-width:620px}
.deck{display:grid;grid-template-columns:1.9fr 1fr;gap:24px;align-items:stretch}
.slider{position:relative;border-radius:22px;overflow:hidden;background:#000;aspect-ratio:1920/842;box-shadow:0 20px 50px #2a145033}
.slider img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s,transform 6s}
.slider img.on{opacity:1;transform:scale(1.05)}
.slider button{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;border:0;background:#ffffffd9;font-size:20px;cursor:pointer}
.slider .p{left:12px}.slider .n{right:12px}
.dots{position:absolute;bottom:12px;left:0;right:0;display:flex;justify-content:center;gap:8px}
.dots i{width:10px;height:10px;border-radius:99px;background:#fff8;cursor:pointer;transition:width .3s}.dots i.on{width:28px;background:var(--coral)}
.plist{background:#fff;border:1px solid var(--line);border-radius:22px;padding:14px;display:flex;flex-direction:column;gap:8px}
.plist h3{font-size:17px;padding:4px 6px}
.pi{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:14px;transition:background .2s,transform .2s}
.pi:hover{background:#f6effd;transform:translateX(4px)}.pi img{width:44px;height:32px;object-fit:contain;border-radius:6px;background:#f4f4f4}
.pi b{flex:1}.pi span{font-weight:800;color:var(--mag)}.pi em{font-style:normal;font-size:12px;color:#8a7da1}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:22px}
.pkg{background:#fff;border:1px solid var(--line);border-radius:22px;padding:20px;text-align:center;transition:transform .3s,box-shadow .3s}
.pkg:hover{transform:translateY(-8px);box-shadow:0 24px 50px #6b2c9126}
.pkg img{border-radius:14px;margin:12px 0}.pkg .pr{font:800 34px Montserrat;color:var(--mag)}.pkg .pr small{font:600 14px Nunito;color:#8a7da1}
.pkg ul{list-style:none;padding:0;margin:10px 0 16px;color:#5b4d73;font-size:15px}.pkg li:before{content:"✓ ";color:var(--coral);font-weight:800}
.pkg.top{border:2px solid var(--coral);position:relative}
.dark{background:linear-gradient(160deg,#1a0f2e,#2a1450 60%,#3a1a6e);color:#fff;position:relative;overflow:hidden}
.dark .sub{color:#cdbbe8}
.orb{position:absolute;width:420px;height:420px;border-radius:50%;filter:blur(90px);opacity:.35;animation:float 12s ease-in-out infinite}
.orb.a{background:#922a8c;left:-120px;top:-80px}.orb.b{background:#f04f4e;right:-140px;bottom:-120px;animation-delay:-6s}
@keyframes float{50%{transform:translate(60px,40px) scale(1.15)}}
.svc{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:26px;position:relative;perspective:900px}
.card{background:linear-gradient(145deg,#ffffff1c,#ffffff08);border:1px solid #ffffff2e;border-radius:24px;padding:26px 22px 28px;backdrop-filter:blur(10px);transition:transform .15s,border-color .3s;transform-style:preserve-3d;opacity:0;translate:0 40px}
.card.in{opacity:1;translate:0 0;transition:opacity .7s,translate .7s,transform .15s}
.card:hover{border-color:#f04f4e99}
.ic{width:84px;height:84px;display:grid;place-items:center;font-size:44px;border-radius:22px;background:linear-gradient(145deg,#f04f4e,#922a8c);box-shadow:0 14px 30px #0005;margin-bottom:34px;-webkit-box-reflect:below 6px linear-gradient(transparent 55%,#ffffff55);animation:bob 4s ease-in-out infinite;transform:translateZ(40px)}
.card:nth-child(2n) .ic{animation-delay:-1s}.card:nth-child(3n) .ic{animation-delay:-2s}
@keyframes bob{50%{translate:0 -8px}}
.card h3{font-size:19px;margin-bottom:8px}.card p{color:#dccdf3;font-size:15px}
.cov{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.cov span{padding:8px 16px;border-radius:99px;background:#f1e8fb;font-weight:800;color:var(--vio)}
.cta{background:linear-gradient(120deg,var(--mag),var(--coral));color:#fff;border-radius:28px;padding:44px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.cta .btn{background:#fff;color:var(--mag)}
form{display:grid;gap:14px;max-width:640px}
input,select,textarea{width:100%;padding:13px 14px;border:1.5px solid var(--line);border-radius:12px;font:inherit;background:#fff}
input:focus,select:focus,textarea:focus{outline:3px solid #922a8c40;border-color:var(--mag)}
label{font-weight:800;font-size:14px;display:grid;gap:6px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:30px}.box{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px}
.note{background:#fff3f3;border-left:4px solid var(--coral);padding:12px 16px;border-radius:8px;margin:14px 0;font-size:14px}
.page-h{background:linear-gradient(135deg,#1a0f2e,#3a1a6e);color:#fff;padding:56px 0}.page-h h1{font-size:clamp(32px,4vw,48px)}
footer.ft{background:#150b26;color:#cdbbe8;padding:50px 0 24px}
.fg{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.4fr;gap:30px}.fg h4{color:#fff;margin-bottom:10px}.fg a{display:block;padding:3px 0}.fg a:hover{color:#fff}
.lg{background:#fff;border-radius:14px;padding:10px 14px;display:inline-block;margin-bottom:12px}.lg img{height:44px}
.badges{display:flex;gap:10px;margin-top:10px}.badges img{height:48px;border-radius:8px;background:#fff}
.copy{border-top:1px solid #ffffff1f;margin-top:30px;padding-top:16px;font-size:14px;text-align:center}
.wa{position:fixed;right:18px;bottom:18px;z-index:60;width:58px;height:58px;border-radius:50%;background:#25d366;display:grid;place-items:center;font-size:30px;box-shadow:0 10px 26px #0005;animation:pulse2 2.4s infinite}
@keyframes pulse2{0%{box-shadow:0 0 0 0 #25d36699}70%{box-shadow:0 0 0 18px #25d36600}}
@media(max-width:900px){.hero .wrap,.deck,.two,.fg{grid-template-columns:1fr}.burger{display:block}
nav{position:absolute;top:74px;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;padding:12px 20px;display:none;border-bottom:1px solid var(--line)}nav.open{display:flex}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.card{opacity:1;translate:0 0}}
/* ---- v2: light, relaxed, premium ---- */
body{background:#fff}
.bg{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.8}.bg svg{width:100%;height:100%}
section,footer{position:relative;z-index:1}
.cb{stroke:#ddd2ee;stroke-width:7}.cp{stroke:#a15bc0;stroke-width:3;stroke-dasharray:36 2200;stroke-dashoffset:0;opacity:.55;animation:run 12s linear infinite}
.fb{stroke:#f6d3e0;stroke-width:1.6}.fp{stroke:#f04f4e;stroke-width:2.6;stroke-dasharray:16 2200;opacity:.6;animation:run 9s linear infinite}
@keyframes run{to{stroke-dashoffset:-2300}}
.nd{animation:blink 3.2s ease-in-out infinite}@keyframes blink{50%{opacity:.15}}
.pl{transform-box:fill-box;transform-origin:center;animation:drift 20s ease-in-out infinite alternate;opacity:.9}
@keyframes drift{from{transform:translate(0,0) rotate(var(--r))}to{transform:translate(34px,-26px) rotate(calc(var(--r) + 14deg))}}
.hero{background:radial-gradient(700px 420px at 80% 30%,#f1e8fb99,transparent 70%);color:var(--ink);padding:60px 0 70px}
.hero h1 span{color:var(--mag)}.hero p{color:#5b4d73}
.btn.ghost{border:2px solid var(--mag);color:var(--mag);background:#fff}
.hero .htxt>*{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}.hero .htxt p{animation-delay:.15s}.hero .acts{animation-delay:.3s}
.meter{animation:rise 1s .2s cubic-bezier(.2,.7,.2,1) both;background:#fffffff0;border:1px solid var(--line);box-shadow:0 30px 70px #6b2c9120}
.meter .val b{color:var(--ink)}.meter .val small{color:#8a7da1}.meter .st{color:#6a5d80}
@keyframes rise{from{opacity:0;transform:translateY(26px)}}
.deck{grid-template-columns:1fr 1.75fr;align-items:center}
.plist{box-shadow:0 20px 50px #6b2c9114}.pi{border:1px solid transparent}.pi:hover{border-color:var(--line)}.pi img{width:56px;height:40px}
.rside .cap{margin-top:12px;color:#7a6d92;font-size:14px;text-align:center}
.sect.soft{background:linear-gradient(180deg,#f7f1fcd9,#fffffff0);overflow:hidden}
.soft .orb{opacity:.18}.soft .sub{color:#6a5d80}
.card{background:#ffffffcc;border:1px solid var(--line);box-shadow:0 18px 40px #6b2c9114;color:var(--ink)}.card p{color:#6a5d80}.card:hover{border-color:#e9a9c9}
.page-h{background:linear-gradient(135deg,#f6effdcc,#ffffffcc);color:var(--ink);border-bottom:1px solid var(--line)}.page-h p{color:#6a5d80!important}
.sect{background:transparent}.sect.soft{background:linear-gradient(180deg,#f7f1fcd9,#fffffff0)}
.meter .val{position:static;transform:none;margin-top:-6px;padding-bottom:4px}
.meter .val b{font-size:56px}
.covgrid{display:grid;grid-template-columns:1fr 1.5fr;gap:24px;align-items:stretch}
.covcard{background:#fff;border:1px solid var(--line);border-radius:24px;padding:34px;box-shadow:0 20px 50px #6b2c9118;display:flex;flex-direction:column;justify-content:center}
.covcard h3{color:var(--mag);font-size:18px;margin-bottom:8px}.covcard h2{font-size:clamp(26px,3vw,36px);margin-bottom:12px}.covcard p{color:#6a5d80}
.mapbox{position:relative;min-height:380px;border-radius:24px;overflow:hidden;border:1px solid var(--line);box-shadow:0 20px 50px #6b2c9118;background:#efe8f8}
.mapbox iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:saturate(.9)}
.tabs{position:absolute;z-index:2;top:12px;left:12px;display:flex;gap:6px;flex-wrap:wrap;background:#ffffffe6;backdrop-filter:blur(6px);padding:6px;border-radius:999px;box-shadow:0 8px 24px #2a145033}
.tabs button{border:0;background:transparent;padding:8px 16px;border-radius:999px;font:800 14px Nunito;color:var(--ink);cursor:pointer;transition:background .25s,color .25s}
.tabs button.on{background:linear-gradient(120deg,var(--mag),var(--coral));color:#fff}
.mtag{position:absolute;z-index:2;left:14px;bottom:14px;background:#2a1450e6;color:#fff;font:800 17px Montserrat,Nunito;padding:10px 16px;border-radius:16px}.mtag small{display:block;font:700 12px Nunito;color:#d9c2f5}
.mopen{position:absolute;z-index:2;right:12px;bottom:14px;background:#fff;padding:8px 14px;border-radius:999px;font-weight:800;font-size:13px;color:var(--mag);box-shadow:0 8px 24px #2a145033}
@media(max-width:900px){.covgrid{grid-template-columns:1fr}}
.covcard{position:relative;overflow:hidden;background:linear-gradient(160deg,#fff,#faf5ff);padding:34px 32px 32px}
.covcard:before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,var(--mag),var(--coral))}
.covcard h2{margin-bottom:16px}
.cimg{position:relative;height:150px;border-radius:18px;overflow:hidden;margin:0 0 18px;box-shadow:0 14px 30px #2a145040}
.cimg img{width:100%;height:100%;object-fit:cover;animation:kb 18s ease-in-out infinite alternate}
@keyframes kb{from{transform:scale(1) translateX(0)}to{transform:scale(1.14) translateX(-3%)}}
.cimg:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,#1a0f2ecc);pointer-events:none}
.cimg:before{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;z-index:2;background:linear-gradient(100deg,transparent,#ffffff40,transparent);animation:shine 6s 1.5s ease-in-out infinite}
@keyframes shine{to{left:130%}}
.cimg span{position:absolute;z-index:3;left:12px;bottom:10px;color:#fff;font-weight:800;font-size:13px}
.tabs{left:auto;right:12px}
.mapbox,.covcard{transition:box-shadow .4s,transform .4s}.mapbox:hover,.covcard:hover{box-shadow:0 30px 70px #6b2c9130;transform:translateY(-4px)}
@media(max-width:600px){.tabs{left:12px;right:12px;top:auto;bottom:70px;justify-content:center}}
.mg{background:linear-gradient(180deg,#f8f3fd,#fff);border:1px solid var(--line);border-radius:16px;padding:12px 8px 10px;margin:12px 0;text-align:center}
.mg svg{width:100%;max-width:190px;display:block;margin:auto}
.mv{margin-top:-14px;color:#8a7da1;font-weight:700;font-size:13px}.mv b{font:800 32px Montserrat;color:var(--mag);margin-right:3px}
.ms{font-size:12px;color:#6a5d80;font-weight:700;margin-top:2px}.ms i{font-style:normal;color:var(--ink);font-weight:800}
.mg.sm{width:60px;padding:0;margin:0;background:none;border:0}.sm .mv,.sm .ms{display:none}
.pkg .pr small{display:block;font:600 14px Nunito;margin-top:2px}.pkg .pr{font-size:30px}
/* ---- terms: photo banner + animated icons ---- */
.phero{position:relative;height:250px;overflow:hidden;display:grid;place-items:center;text-align:center;color:#fff}
.phero .pimg{position:absolute;inset:0;background:url(img/terms-banner.jpg) center/cover;animation:kb 22s ease-in-out infinite alternate}
.phero:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(120deg,#1a0f2ecc,#6b2c9166 60%,#1a0f2eaa)}
.phero .wrap{position:relative;z-index:2}.phero h1{font-size:clamp(32px,4.4vw,52px);animation:rise .9s both}.phero p{color:#eadff7;margin-top:8px;animation:rise .9s .15s both}
.phero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;z-index:2;background:linear-gradient(90deg,var(--mag),var(--coral))}
.center{text-align:center;margin-bottom:34px}.kick{color:var(--mag);font-weight:800;margin-bottom:6px}.center h2{font-size:clamp(24px,3vw,34px)}
.ico4{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:24px}
.ib{background:#fff;border:1.5px solid var(--line);border-radius:24px;padding:28px 18px;text-align:center;box-shadow:0 16px 40px #6b2c9112;transition:transform .35s,border-color .35s,box-shadow .35s}
.ib:hover{transform:translateY(-8px);border-color:var(--mag);box-shadow:0 26px 54px #922a8c30}
.ib h3{margin-top:14px;font-size:19px}.ib p{color:#6a5d80;font-size:14px;margin-top:4px}
.ring{position:relative;width:92px;height:92px;margin:auto;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#f6effd,#fff);color:var(--mag)}
.ring:before{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid #922a8c40;animation:ripple 3s ease-out infinite}
.ib:nth-child(2) .ring:before{animation-delay:.7s}.ib:nth-child(3) .ring:before{animation-delay:1.4s}.ib:nth-child(4) .ring:before{animation-delay:2.1s}
@keyframes ripple{from{transform:scale(.85);opacity:.9}to{transform:scale(1.3);opacity:0}}
.ring svg{width:50px;height:50px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.up{animation:upx 2.2s ease-in-out infinite}@keyframes upx{0%{transform:translateY(5px);opacity:0}40%{opacity:1}100%{transform:translateY(-5px);opacity:0}}
.spin{transform-box:fill-box;transform-origin:center;animation:sp 4s ease-in-out infinite}@keyframes sp{50%{transform:scaleX(.12)}}
.ph{transform-box:fill-box;transform-origin:center;animation:wig 3.2s ease-in-out infinite}@keyframes wig{0%,60%,100%{transform:rotate(0)}70%{transform:rotate(-6deg)}80%{transform:rotate(5deg)}90%{transform:rotate(-3deg)}}
.w1,.w2{animation:wv 1.8s ease-in-out infinite}.w2{animation-delay:.35s}@keyframes wv{0%,100%{opacity:.15}50%{opacity:1}}
.sh{fill:#f6effd;transform-box:fill-box;transform-origin:center;animation:sb 3s ease-in-out infinite}@keyframes sb{50%{transform:scale(1.06)}}
.ck{stroke-dasharray:32;stroke-dashoffset:32;animation:dr 3s ease-in-out infinite}@keyframes dr{0%{stroke-dashoffset:32}45%,85%{stroke-dashoffset:0}100%{stroke-dashoffset:-32}}
.tgrid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:22px}
.tc{display:flex;gap:16px;background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px;box-shadow:0 14px 34px #6b2c9110;transition:transform .3s,box-shadow .3s}
.tc:hover{transform:translateY(-5px);box-shadow:0 22px 44px #6b2c9122}
.te{flex:none;width:54px;height:54px;border-radius:16px;display:grid;place-items:center;font-size:28px;background:linear-gradient(145deg,#f04f4e,#922a8c);box-shadow:0 10px 22px #922a8c40}
.tc h3{font-size:18px;margin-bottom:4px}.tc p{color:#6a5d80;font-size:15px}
@media(max-width:700px){.tgrid{grid-template-columns:1fr}}
/* ---- about ---- */
.srvrow{display:flex;gap:34px;align-items:center;background:linear-gradient(135deg,#fff,#faf5ff);border:1px solid var(--line);border-radius:28px;padding:26px 34px;box-shadow:0 20px 50px #6b2c9114}
.srvbox{flex:none;width:170px}.srv-svg{width:100%;display:block;animation:fl 6s ease-in-out infinite}
@keyframes fl{50%{transform:translateY(-8px)}}
.led{fill:#cdbbe8}.led.g{fill:#34d399;animation:blink 1.6s ease-in-out infinite}.led.p{fill:#922a8c;animation:blink 2.3s ease-in-out infinite}
.unit{animation:slide .9s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--d)}@keyframes slide{from{opacity:0;transform:translateX(-26px)}}
.sbar{stroke-dasharray:14 300;animation:run 3.6s linear infinite;opacity:.5}
.aboutspd{align-items:center;gap:50px}
.spdbox{position:relative;border-radius:32px;padding:18px;background:linear-gradient(145deg,#f6effd,#fff);border:1px solid var(--line);box-shadow:0 30px 70px #6b2c9120}
.spdbox .glow{position:absolute;inset:auto 10% -18px 10%;height:40px;background:#922a8c33;filter:blur(28px);border-radius:50%}
.spd-svg{position:relative;width:100%;display:block;overflow:visible}
.flow{animation:flw 1.4s linear infinite}@keyframes flw{to{stroke-dashoffset:-28}}
.wv{opacity:.12;animation:wvx 2.4s ease-in-out infinite}.wv.a2{animation-delay:.3s}.wv.a3{animation-delay:.6s}@keyframes wvx{40%{opacity:1}}
.fl{animation:fl 5s ease-in-out infinite}.f2{animation-delay:-1.2s}.f3{animation-delay:-2.4s}.f4{animation-delay:-3.4s}
@media(max-width:700px){.srvrow{flex-direction:column;text-align:center}}

/* ---- services banner: drawn characters ---- */
.page-h.chars-h{padding:34px 0 46px;position:relative;overflow:visible}
.svh{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,1.1fr) minmax(0,1fr);align-items:center;gap:10px}
.svh .mid{text-align:center}.svh .mid p{max-width:460px;margin:12px auto 0}
.fig{position:relative;width:100%}.fig.g{justify-self:start;max-width:250px}.fig.b{justify-self:end;max-width:290px}
.fig svg{display:block;width:100%;height:auto;overflow:visible}
.say{position:absolute;left:50%;bottom:-24px;transform:translateX(-50%);border:1.5px solid var(--line);background:#fff;color:var(--mag);border-radius:999px;padding:6px 14px;font:800 13px Nunito,sans-serif;cursor:pointer;box-shadow:0 8px 20px #6b2c9122;transition:box-shadow .2s}
.say:hover{box-shadow:0 12px 24px #922a8c33}.say:focus-visible{outline:3px solid #922a8c66;outline-offset:2px}
.chars svg *{transform-box:view-box}
.chars.js .d{stroke-dasharray:1;stroke-dashoffset:1;fill-opacity:0}.chars.js .fade{opacity:0}
.chars.js.in .d{animation:draw 1.5s cubic-bezier(.5,0,.3,1) var(--dl) forwards,fillin .6s ease calc(var(--dl) + 1.1s) forwards}
.chars.js.in .fade{animation:fadein .6s ease var(--dl) forwards}
@keyframes draw{to{stroke-dashoffset:0}}@keyframes fillin{to{fill-opacity:1}}@keyframes fadein{to{opacity:1}}
.g-bub,.g-flash,.g-click,.g-polaroid,.g-waves,.g-end,.g-pf,.b-bub,.b-obub,.b-bx2,.b-r1,.b-r2{opacity:0}
.g-mouth{transform-origin:120px 112px;transform:scaleY(.12)}.b-mouth{transform-origin:208px 148px;transform:scaleY(.12)}
.b-cur{transform:translate(100px,176px)}.g-polaroid{transform:translate(236px,196px) rotate(8deg)}
.b-r1,.b-r2{transform-box:fill-box;transform-origin:center}
.eye{transform-box:fill-box;transform-origin:center}
.chars.in .g-bub{transform-origin:46px 60px;animation:gbub 16s linear 2.8s infinite backwards}
.chars.in .g-larm{transform-origin:84px 168px;animation:gwave 1.1s ease-in-out 2.4s infinite alternate backwards}
.chars.in .g-rarm{transform-origin:148px 168px;animation:grarm 16s ease-in-out 2.8s infinite backwards}
.chars.in .g-ph{transform-origin:173px 256px;animation:gph 16s ease-in-out 2.8s infinite backwards}
.chars.in .g-pb{animation:gpb 16s linear 2.8s infinite backwards}.chars.in .g-pf{animation:gpf 16s linear 2.8s infinite backwards}
.chars.in .g-head{transform-origin:120px 140px;animation:ghead 16s ease-in-out 2.8s infinite backwards}
.chars.in .g-waves{animation:gwaves 16s linear 2.8s infinite backwards}
.chars.in .g-waves path{animation:arc .9s ease-in-out infinite}.g-waves .w2{animation-delay:.15s!important}.g-waves .w3{animation-delay:.3s!important}
.chars.in .g-end{transform-origin:196px 124px;animation:gend 16s linear 2.8s infinite backwards}
.chars.in .g-flash{transform-origin:209px 70px;animation:gflash 16s linear 2.8s infinite backwards}
.chars.in .g-click{transform-origin:226px 40px;animation:gclick 16s linear 2.8s infinite backwards}
.chars.in .g-polaroid{animation:gpol 16s ease-out 2.8s infinite backwards}
.chars.in .g-mouth{animation:gmouth 16s linear 2.8s infinite backwards}
.chars.in .g-rem{animation:rem 1.6s ease-in-out infinite alternate}.chars.in .g-live{animation:live 1s steps(2) infinite}
@keyframes gwave{from{transform:rotate(4deg)}to{transform:rotate(24deg)}}
@keyframes grarm{0%{transform:rotate(0)}5%,30%{transform:rotate(-150deg)}36%,42%{transform:rotate(0)}46%,62%{transform:rotate(-118deg)}67%,89%{transform:rotate(-95deg)}95%,100%{transform:rotate(0)}}
@keyframes gph{0%{transform:rotate(0) scale(1)}5%,30%{transform:rotate(150deg) scale(1)}36%,42%{transform:rotate(0) scale(1)}46%,62%{transform:rotate(118deg) scale(1)}67%,89%{transform:rotate(95deg) scale(1.3)}95%,100%{transform:rotate(0) scale(1)}}
@keyframes gpb{0%,64%{opacity:1}66%,90%{opacity:0}92%,100%{opacity:1}}
@keyframes gpf{0%,64%{opacity:0}66%,90%{opacity:1}92%,100%{opacity:0}}
@keyframes ghead{0%,3%{transform:rotate(0)}6%,30%{transform:rotate(6deg)}36%,44%{transform:rotate(0)}48%,62%{transform:rotate(-5deg)}67%,100%{transform:rotate(0)}}
@keyframes gwaves{0%,6%{opacity:0}8%,28%{opacity:1}31%,100%{opacity:0}}
@keyframes arc{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes gend{0%,31%{opacity:0;transform:scale(.3)}34%{opacity:1;transform:scale(1.15)}37%,40%{opacity:1;transform:scale(1)}43%,100%{opacity:0;transform:scale(.6)}}
@keyframes gflash{0%,51%{opacity:0;transform:scale(.2) rotate(0)}52.5%{opacity:1;transform:scale(1) rotate(10deg)}57%,100%{opacity:0;transform:scale(1.7) rotate(25deg)}}
@keyframes gclick{0%,52%{opacity:0;transform:scale(.4) rotate(12deg)}55%{opacity:1;transform:scale(1.15) rotate(12deg)}62%{opacity:1;transform:scale(1) rotate(12deg)}65%,100%{opacity:0;transform:scale(.8) rotate(12deg)}}
@keyframes gpol{0%,53%{opacity:0;transform:translate(236px,160px) rotate(-6deg) scale(.2)}57%{opacity:1;transform:translate(236px,196px) rotate(8deg) scale(1.08)}59%,63%{opacity:1;transform:translate(236px,196px) rotate(8deg) scale(1)}66%,100%{opacity:0;transform:translate(236px,210px) rotate(8deg) scale(.9)}}
@keyframes rem{from{transform:translateY(0)}to{transform:translateY(-1.5px)}}@keyframes live{50%{opacity:.2}}
@keyframes gbub{0%{opacity:0;transform:scale(.3)}6%{opacity:0;transform:scale(.3)}9%{opacity:1;transform:scale(1.1)}11%,28%{opacity:1;transform:scale(1)}31%{opacity:0;transform:scale(.6)}44%{opacity:0;transform:scale(.3)}47%{opacity:1;transform:scale(1.1)}49%,60%{opacity:1;transform:scale(1)}63%{opacity:0;transform:scale(.6)}66%{opacity:0;transform:scale(.3)}69%{opacity:1;transform:scale(1.1)}71%,88%{opacity:1;transform:scale(1)}91%{opacity:0;transform:scale(.6)}100%{opacity:0;transform:scale(.6)}}
@keyframes gmouth{0%{transform:scaleY(0.12)}7.99%{transform:scaleY(0.12)}8%{transform:scaleY(1)}9.3%{transform:scaleY(0.35)}10.6%{transform:scaleY(1)}11.9%{transform:scaleY(0.35)}13.2%{transform:scaleY(1)}14.5%{transform:scaleY(0.35)}15.8%{transform:scaleY(1)}17.1%{transform:scaleY(0.35)}18.4%{transform:scaleY(1)}19.7%{transform:scaleY(0.35)}21.0%{transform:scaleY(1)}22.3%{transform:scaleY(0.35)}23.6%{transform:scaleY(1)}24.9%{transform:scaleY(0.35)}26.2%{transform:scaleY(1)}27.5%{transform:scaleY(0.35)}28%{transform:scaleY(0.12)}45.99%{transform:scaleY(0.12)}46%{transform:scaleY(1)}47.3%{transform:scaleY(0.35)}48.6%{transform:scaleY(1)}49.9%{transform:scaleY(0.35)}51.2%{transform:scaleY(1)}52.5%{transform:scaleY(0.35)}53.8%{transform:scaleY(1)}55.1%{transform:scaleY(0.35)}56.4%{transform:scaleY(1)}57.7%{transform:scaleY(0.35)}59.0%{transform:scaleY(1)}60%{transform:scaleY(0.12)}67.99%{transform:scaleY(0.12)}68%{transform:scaleY(1)}69.3%{transform:scaleY(0.35)}70.6%{transform:scaleY(1)}71.9%{transform:scaleY(0.35)}73.2%{transform:scaleY(1)}74.5%{transform:scaleY(0.35)}75.8%{transform:scaleY(1)}77.1%{transform:scaleY(0.35)}78.4%{transform:scaleY(1)}79.7%{transform:scaleY(0.35)}81.0%{transform:scaleY(1)}82.3%{transform:scaleY(0.35)}83.6%{transform:scaleY(1)}84.9%{transform:scaleY(0.35)}86.2%{transform:scaleY(1)}87.5%{transform:scaleY(0.35)}88%{transform:scaleY(0.12)}100%{transform:scaleY(0.12)}}
/* boy: 12s loop */
.chars.in .b-bub{transform-origin:226px 60px;animation:bbub 12s linear 2.8s infinite backwards}
.chars.in .b-obub{transform-origin:44px 100px;animation:obub 12s linear 2.8s infinite backwards}
.chars.in .b-bx2{animation:bbx2 12s linear 2.8s infinite backwards}
.chars.in .b-scroll{animation:bscroll 5s linear 2.4s infinite}
.chars.in .b-cur{animation:bcur 12s ease-in-out 2.8s infinite backwards}
.chars.in .b-r1{animation:br1 12s linear 2.8s infinite backwards}.chars.in .b-r2{animation:br2 12s linear 2.8s infinite backwards}
.chars.in .b-larm{animation:bpress 12s linear 2.8s infinite backwards}
.chars.in .b-rarm{animation:bnod 2.4s ease-in-out 2.6s infinite alternate backwards}
.chars.in .b-head{transform-origin:206px 160px;animation:bhead 12s ease-in-out 2.8s infinite backwards}
.chars.in .b-steam{animation:steam 2.6s ease-in-out 2.4s infinite backwards}
.chars.in .b-mouth{animation:bmouth 12s linear 2.8s infinite backwards}
.chars.in .b-wave rect{transform-box:fill-box;transform-origin:bottom;animation:wv .5s ease-in-out infinite alternate}
.b-wave rect:nth-child(2){animation-delay:.15s!important}.b-wave rect:nth-child(3){animation-delay:.3s!important;width:1.8px}
@keyframes wv{from{transform:scaleY(.4)}to{transform:scaleY(2.2)}}
@keyframes bscroll{to{transform:translateY(-60px)}}
@keyframes bbx2{0%,21%{opacity:0}23%,100%{opacity:1}}
@keyframes bcur{0%,8%{transform:translate(100px,176px)}14%,17%{transform:translate(62px,168px)}40%{transform:translate(88px,182px)}52%,57%{transform:translate(104px,160px)}80%{transform:translate(78px,150px)}100%{transform:translate(100px,176px)}}
@keyframes br1{0%,14.5%{opacity:0;transform:scale(.3)}15%{opacity:1;transform:scale(.3)}22%,100%{opacity:0;transform:scale(3.2)}}
@keyframes br2{0%,54.5%{opacity:0;transform:scale(.3)}55%{opacity:1;transform:scale(.3)}62%,100%{opacity:0;transform:scale(3.2)}}
@keyframes bpress{0%,14%{transform:translateY(0)}15%{transform:translateY(3px)}17%,54%{transform:translateY(0)}55%{transform:translateY(3px)}57%,100%{transform:translateY(0)}}
@keyframes bnod{from{transform:translateY(0)}to{transform:translateY(-2px)}}
@keyframes bhead{0%,15%{transform:rotate(-3deg)}30%,60%{transform:rotate(3deg)}100%{transform:rotate(-3deg)}}
@keyframes steam{0%{opacity:.2;transform:translateY(2px)}50%{opacity:1;transform:translateY(-3px)}100%{opacity:.2;transform:translateY(-6px)}}
@keyframes bbub{0%{opacity:0;transform:scale(.3)}8%{opacity:0;transform:scale(.3)}11%{opacity:1;transform:scale(1.1)}13%,44%{opacity:1;transform:scale(1)}47%{opacity:0;transform:scale(.6)}100%{opacity:0;transform:scale(.6)}}
@keyframes obub{0%{opacity:0;transform:scale(.3)}48%{opacity:0;transform:scale(.3)}51%{opacity:1;transform:scale(1.1)}53%,84%{opacity:1;transform:scale(1)}87%{opacity:0;transform:scale(.6)}100%{opacity:0;transform:scale(.6)}}
@keyframes bmouth{0%{transform:scaleY(0.12)}9.99%{transform:scaleY(0.12)}10%{transform:scaleY(1)}11.3%{transform:scaleY(0.35)}12.6%{transform:scaleY(1)}13.9%{transform:scaleY(0.35)}15.2%{transform:scaleY(1)}16.5%{transform:scaleY(0.35)}17.8%{transform:scaleY(1)}19.1%{transform:scaleY(0.35)}20.4%{transform:scaleY(1)}21.7%{transform:scaleY(0.35)}23.0%{transform:scaleY(1)}24.3%{transform:scaleY(0.35)}25.6%{transform:scaleY(1)}26.9%{transform:scaleY(0.35)}28.2%{transform:scaleY(1)}29.5%{transform:scaleY(0.35)}30.8%{transform:scaleY(1)}32.1%{transform:scaleY(0.35)}33.4%{transform:scaleY(1)}34.7%{transform:scaleY(0.35)}36.0%{transform:scaleY(1)}37.3%{transform:scaleY(0.35)}38.6%{transform:scaleY(1)}39.9%{transform:scaleY(0.35)}41.2%{transform:scaleY(1)}42.5%{transform:scaleY(0.35)}43.8%{transform:scaleY(1)}44%{transform:scaleY(0.12)}100%{transform:scaleY(0.12)}}
.chars.in .eye{animation:blink 4.2s infinite 3s}@keyframes blink{0%,94%,100%{transform:scaleY(1)}97%{transform:scaleY(.1)}}
.say.pulse{animation:pulse .6s}@keyframes pulse{40%{transform:translateX(-50%) scale(1.12)}}
@media(max-width:860px){
 .svh{grid-template-columns:1fr 1fr;grid-template-areas:"mid mid" "g b";row-gap:44px}
 .svh .mid{grid-area:mid}.fig.g{grid-area:g;justify-self:center;max-width:190px}.fig.b{grid-area:b;justify-self:center;max-width:210px}
 .page-h.chars-h{padding-bottom:60px}
}
@media(prefers-reduced-motion:reduce){
 .chars *{animation:none!important}.chars.js .d{stroke-dashoffset:0;fill-opacity:1}.chars.js .fade{opacity:1}
 .g-bub,.b-bub,.b-bx2,.b-obub{opacity:1}
}
.chars svg .eye,.chars svg .b-r1,.chars svg .b-r2,.chars svg .b-wave rect{transform-box:fill-box}
.chars svg .eye,.chars svg .b-r1,.chars svg .b-r2{transform-origin:center}
.chars svg .b-wave rect{transform-origin:bottom}

/* ---- php forms ---- */
.hp{position:absolute!important;left:-9999px!important;top:auto;width:1px;height:1px;overflow:hidden}
.note.err{background:#fff3f3;border-left-color:#f04f4e}.note.err ul{margin:6px 0 0 18px}
.okbox{border-color:#bfe7d0;background:linear-gradient(180deg,#f3fcf7,#fff)}.okbox h3{color:#16875a}
.tno{font:800 30px Montserrat,sans-serif;color:#922a8c;margin:6px 0 10px;letter-spacing:.5px;word-break:break-all}
.fine{font-size:13px;color:#8a7da1;margin-top:8px}
form label{display:block}

/* ================================================================
   HERO NETWORK SCENE - technician connects home to Ka Kha cloud
   one 14s story loop, pure SVG + CSS, no scripts
   ================================================================ */
.netviz{--T:14s;position:relative;max-width:580px;margin:auto;width:100%;border-radius:28px;overflow:hidden;
 background:linear-gradient(180deg,#e9defa 0,#f7f0ff 48%,#fdf9ff 100%);border:1px solid var(--line);box-shadow:0 30px 70px #6b2c9124;
 animation:rise 1s .2s cubic-bezier(.2,.7,.2,1) both}
.netviz svg{display:block;width:100%;height:auto}
.nv-root{animation:nv-root var(--T) linear infinite}
@keyframes nv-root{0%{opacity:0}2.5%,95%{opacity:1}100%{opacity:0}}
.nv-cap{position:absolute;left:12px;right:12px;bottom:12px;height:38px;pointer-events:none}
.nv-cap span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:8px;opacity:0;
 background:#ffffffee;border:1px solid var(--line);border-radius:999px;font:800 14px/1.2 Nunito,system-ui,sans-serif;color:var(--deep);box-shadow:0 8px 22px #6b2c9122;padding:0 14px;text-align:center}
.nv-cap b{width:9px;height:9px;border-radius:50%;background:var(--coral);flex:none}
.nv-cap .c4 b{background:#22c55e;box-shadow:0 0 0 0 #22c55e88;animation:nv-ping 1.4s ease-out infinite}
.nv-cap .c1{animation:nv-c1 var(--T) linear infinite}.nv-cap .c2{animation:nv-c2 var(--T) linear infinite}
.nv-cap .c3{animation:nv-c3 var(--T) linear infinite}.nv-cap .c4{animation:nv-c4 var(--T) linear infinite}
.nv-spd{position:absolute;right:14px;top:14px;display:flex;align-items:baseline;gap:5px;background:#2a1450;color:#fff;border-radius:14px;padding:6px 12px;opacity:0;
 animation:nv-spd var(--T) linear infinite;box-shadow:0 10px 24px #2a145055}
.nv-spd b{font:800 20px Montserrat,Nunito,sans-serif}.nv-spd small{font-weight:800;font-size:12px;color:var(--lil)}
.nv-spd i{width:8px;height:8px;border-radius:50%;background:#22c55e;align-self:center;animation:nv-ping 1.4s ease-out infinite}
@keyframes nv-ping{0%{box-shadow:0 0 0 0 #22c55eaa}100%{box-shadow:0 0 0 9px #22c55e00}}
.nv-tag{position:absolute;top:14px;left:14px;font:800 12px Nunito,sans-serif;letter-spacing:.4px;color:var(--mag);background:#ffffffcc;border:1px solid var(--line);border-radius:999px;padding:4px 10px}
@keyframes nv-c1{0%,25%{opacity:1}26.2%,100%{opacity:0}}
@keyframes nv-c2{0%,25.8%{opacity:0}27%,40%{opacity:1}41.2%,100%{opacity:0}}
@keyframes nv-c3{0%,40.8%{opacity:0}42%,57%{opacity:1}58.2%,100%{opacity:0}}
@keyframes nv-c4{0%,57.8%{opacity:0}59%,90%{opacity:1}91.2%,100%{opacity:0}}
@keyframes nv-spd{0%,58.8%{opacity:0}60%,90%{opacity:1}91.2%,100%{opacity:0}}
@keyframes nv-tech{0%{transform:translateX(-135px);opacity:0}5%{opacity:1;transform:translateX(-135px)}26%{transform:translateX(0)}86%{transform:translateX(0);opacity:1}93%,100%{opacity:0;transform:translateX(0)}}
@keyframes nv-walkon{0%,26%{opacity:1}26.5%,100%{opacity:0}}
@keyframes nv-stand{0%,26%{opacity:0}26.5%,100%{opacity:1}}
@keyframes nv-plug{0%,26.5%{opacity:0;transform:rotate(0)}27.5%{opacity:1;transform:rotate(0)}31%,39%{opacity:1;transform:rotate(-88deg)}40.5%,100%{opacity:0;transform:rotate(-88deg)}}
@keyframes nv-thumb{0%,40%{opacity:0}41%,54%{opacity:1}55%,100%{opacity:0}}
@keyframes nv-swing{0%,100%{transform:rotate(26deg)}50%{transform:rotate(-26deg)}}
@keyframes nv-swing2{0%,100%{transform:rotate(-26deg)}50%{transform:rotate(26deg)}}
@keyframes nv-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.6px)}}
@keyframes nv-plugc{0%,28%{opacity:0}31%,90%{opacity:1}93%,100%{opacity:0}}
@keyframes nv-flow{0%,36.5%{opacity:0}39%,89%{opacity:1}91.5%,100%{opacity:0}}
@keyframes nv-dash{to{stroke-dashoffset:-34}}
@keyframes nv-cloudon{0%,37.5%{opacity:0}40%,90%{opacity:1}92.5%,100%{opacity:0}}
@keyframes nv-lights{0%,38.5%{opacity:0}41%,90%{opacity:1}92.5%,100%{opacity:0}}
@keyframes nv-dim{0%,40%{opacity:.42}44%,89%{opacity:0}95%,100%{opacity:.42}}
@keyframes nv-ledr{0%,41%{opacity:1}42%,100%{opacity:0}}
@keyframes nv-ledg{0%,40%{opacity:0}42%,90%{opacity:1}92%,100%{opacity:0}}
@keyframes nv-wifi{0%,40.5%{opacity:0}43%,90%{opacity:1}92.5%,100%{opacity:0}}
@keyframes nv-arc{0%{opacity:0}30%{opacity:1}70%,100%{opacity:0}}
@keyframes nv-tvoff{0%,50%{opacity:1}50.8%,100%{opacity:0}}
@keyframes nv-tvspin{0%,49.4%{opacity:0}50%,58.2%{opacity:1}58.800000000000004%,100%{opacity:0}}
@keyframes nv-tvcall{0%,56.5%{opacity:0}58.5%,90%{opacity:1}92%,100%{opacity:0}}
@keyframes nv-spin{to{transform:rotate(360deg)}}
@keyframes nv-static{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
@keyframes nv-cheer{0%,57%{transform:translateY(0)}58.5%{transform:translateY(-5px)}60%{transform:translateY(0)}61.5%{transform:translateY(-5px)}63%,100%{transform:translateY(0)}}
@keyframes nv-wave{0%,100%{transform:rotate(-12deg)}50%{transform:rotate(26deg)}}
@keyframes nv-hearts{0%,60%{opacity:0}62%,89%{opacity:1}91%,100%{opacity:0}}
@keyframes nv-heart{0%{transform:translate(0,0) scale(.4);opacity:0}15%{opacity:1}100%{transform:translate(var(--dx),-70px) scale(1);opacity:0}}
@keyframes nv-blink{0%,45%,100%{opacity:1}50%,95%{opacity:.18}}
@keyframes nv-cloudmove{0%{transform:translateX(0)}100%{transform:translateX(34px)}}
@keyframes nv-up{to{stroke-dashoffset:-20}}
@keyframes nv-glow{0%,100%{opacity:.55}50%{opacity:1}}

.nv-tech{animation:nv-tech var(--T) linear infinite}
.nv-walk{animation:nv-walkon var(--T) linear infinite}.nv-stand{animation:nv-stand var(--T) linear infinite}
.nv-plugarm{transform-origin:4px -48px;animation:nv-plug var(--T) linear infinite}
.nv-thumb{animation:nv-thumb var(--T) linear infinite}
.nv-lg1{transform-origin:0 -22px;animation:nv-swing .62s ease-in-out infinite}.nv-lg2{transform-origin:0 -22px;animation:nv-swing2 .62s ease-in-out infinite}
.nv-ar1{transform-origin:4px -48px;animation:nv-swing2 .62s ease-in-out infinite}.nv-ar2{transform-origin:4px -48px;animation:nv-swing .62s ease-in-out infinite}
.nv-wb{animation:nv-bob .31s ease-in-out infinite}
.nv-plugc{animation:nv-plugc var(--T) linear infinite}
.nv-flow{animation:nv-flow var(--T) linear infinite}.nv-flow path{animation:nv-dash .85s linear infinite}
.nv-cloudon{animation:nv-cloudon var(--T) linear infinite}
.nv-lights{animation:nv-lights var(--T) linear infinite}.nv-dim{animation:nv-dim var(--T) linear infinite}
.nv-ledr{animation:nv-ledr var(--T) linear infinite}.nv-ledg{animation:nv-ledg var(--T) linear infinite}
.nv-wifi{animation:nv-wifi var(--T) linear infinite}.nv-wifi path{animation:nv-arc 1.8s ease-out infinite}
.nv-tvoff{animation:nv-tvoff var(--T) linear infinite}.nv-tvspin{animation:nv-tvspin var(--T) linear infinite}.nv-tvcall{animation:nv-tvcall var(--T) linear infinite}
.nv-static{animation:nv-static .7s linear infinite}
.nv-spin{transform-origin:0 0;animation:nv-spin .9s linear infinite}
.nv-fam{animation:nv-cheer var(--T) linear infinite}
.nv-wave{transform-origin:0 0;animation:nv-wave .7s ease-in-out infinite}
.nv-hearts{animation:nv-hearts var(--T) linear infinite}.nv-hearts path{animation:nv-heart 2.4s ease-out infinite}
.nv-led{animation:nv-blink 1.6s steps(1) infinite}
.nv-cl{animation:nv-cloudmove 22s ease-in-out infinite alternate}
.nv-up{animation:nv-up .9s linear infinite}
.nv-cglow{animation:nv-glow 2.2s ease-in-out infinite}
@media(max-width:900px){.netviz{max-width:520px}.hero .htxt{text-align:center}.hero p{margin-left:auto;margin-right:auto}.hero .acts{justify-content:center}}
@media(max-width:480px){.netviz{border-radius:22px}.nv-cap span{font-size:12.5px;height:34px}.nv-cap{height:34px;left:8px;right:8px;bottom:8px}.nv-spd{top:10px;right:10px;padding:4px 9px}.nv-spd b{font-size:16px}.nv-tag{top:10px;left:10px;font-size:11px}}
@media(prefers-reduced-motion:reduce){
 .netviz,.netviz *{animation:none!important}
 .nv-root{opacity:1}.nv-tech{opacity:1;transform:none}.nv-walk,.nv-plugarm,.nv-tvoff,.nv-tvspin,.nv-ledr,.nv-dim,.nv-cap .c1,.nv-cap .c2,.nv-cap .c3{opacity:0}
 .nv-stand,.nv-thumb,.nv-plugc,.nv-flow,.nv-cloudon,.nv-lights,.nv-ledg,.nv-wifi,.nv-tvcall,.nv-spd,.nv-cap .c4{opacity:1}
 .nv-thumb{opacity:1}.nv-hearts{opacity:0}.nv-wifi path{opacity:.8}
}

/* ===== MOBILE FIX v3 ===== */
html,body{overflow-x:hidden;max-width:100%}
img,svg,video,iframe{max-width:100%}
table{display:block;max-width:100%;overflow-x:auto}
@media(max-width:900px){
 .wrap{padding:0 16px}
 .wa{width:50px;height:50px;font-size:25px;right:12px;bottom:12px}
 .hero{padding:32px 0 40px}
 .deck,.two,.fg,.covgrid,.tgrid{grid-template-columns:1fr!important}
 .grid,.cards,.pk,.plans{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
 h2{font-size:clamp(24px,6vw,32px)}
 .srvrow{flex-direction:column;text-align:center}
}
@media(max-width:600px){
 .hero .wrap{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);column-gap:12px;row-gap:0;align-items:center;text-align:left}
 .hero .htxt{display:contents}
 .hero h1{grid-column:1;grid-row:1;font-size:27px;letter-spacing:-.5px;text-align:left;margin:0}
 .hero h1 span{font-size:13px;margin-top:8px;line-height:1.3}
 .hero .netviz{grid-column:2;grid-row:1;aspect-ratio:1/1.05;max-width:none;border-radius:18px;align-self:center}
 .hero .netviz svg{height:100%}
 .hero .htxt p{grid-column:1/-1;grid-row:2;margin:18px 0 18px;max-width:none;font-size:16px;text-align:left}
 .hero .acts{grid-column:1/-1;grid-row:3;justify-content:flex-start;flex-wrap:wrap;gap:10px}
 .nv-cap,.nv-spd{display:none}
 .nv-tag{top:6px;left:6px;font-size:9px;padding:2px 7px}
 .tabs button{padding:7px 11px;font-size:13px}
}
@media(max-width:900px){
 .deck,.two,.fg,.covgrid,.tgrid,.hero .wrap{grid-template-columns:minmax(0,1fr)!important}
 .deck>*,.two>*,.fg>*,.covgrid>*,.tgrid>*,.wrap>*{min-width:0}
 .grid{grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr))!important}
 .sect,.wrap{max-width:100%;overflow-x:clip}
 .fg,.pkg,.covcard,.box,form,input,select,textarea,.note{max-width:100%;box-sizing:border-box}
 input,select,textarea{width:100%}
}
@media(max-width:600px){
 .hero .wrap{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)!important}
}

/* ===== PREMIUM POLISH v4 ===== */
svg.i{width:1em;height:1em;flex:none;vertical-align:-.14em}
.ic svg.i{width:42px;height:42px;color:#fff;stroke-width:1.6}
.te svg.i{width:26px;height:26px;color:#fff}
.fi{width:16px;height:16px;margin-right:6px;color:var(--lil,#d9c2f5);vertical-align:-3px}
.burger svg.i{width:26px;height:26px}
.wa svg{display:block}
.pkg{position:relative;overflow:hidden;box-shadow:0 10px 30px #6b2c910f}
.pkg::before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:linear-gradient(90deg,#922a8c,#f04f4e)}
.pkg.top{box-shadow:0 26px 60px #f04f4e33;transform:translateY(-6px)}
.pkg.top::after{content:"Most Popular";position:absolute;top:16px;right:-34px;transform:rotate(38deg);background:linear-gradient(120deg,#922a8c,#f04f4e);color:#fff;font:800 11px Nunito,sans-serif;letter-spacing:.6px;padding:4px 40px}
.pkg .btn{width:100%;display:block;box-sizing:border-box}
.card .ic{transition:transform .35s}.card:hover .ic{transform:translateY(-4px) scale(1.05)}
.btn{box-shadow:0 10px 24px #f04f4e40;transition:transform .2s,box-shadow .2s}.btn:hover{transform:translateY(-2px);box-shadow:0 16px 32px #f04f4e55}
.btn.ghost{box-shadow:none}
@media(max-width:600px){.ic svg.i{width:34px;height:34px}.pkg.top{transform:none}}
.ic{-webkit-box-reflect:none!important;margin-bottom:22px}

/* hotline bar + 4-up package grid on home */
.hotbar{background:linear-gradient(90deg,#6b2c91,#922a8c 55%,#f04f4e);color:#fff;font-size:14px}
.hotbar .wrap{display:flex;justify-content:flex-end;align-items:center;gap:14px;min-height:34px}
.hotbar span{opacity:.85;font-weight:700}
.hotbar a{color:#fff;font-weight:700;display:inline-flex;align-items:center;gap:6px}
.hotbar a:hover{text-decoration:underline}
.hotbar .fi,.ft .hl .fi{width:15px;height:15px}
.ft .hl{font-weight:800}
.pgrid{grid-template-columns:repeat(4,minmax(0,1fr))!important;align-items:start}
@media(max-width:1000px){.pgrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:560px){.hotbar .wrap{justify-content:center}.hotbar span{display:none}.pgrid{grid-template-columns:minmax(0,1fr)!important}}

/* ===== About page (premium layout) ===== */
.ab-eye{display:inline-block;font:800 12px Nunito,sans-serif;letter-spacing:1.6px;text-transform:uppercase;color:var(--mag);background:#f1e8fb;padding:6px 14px;border-radius:99px;margin-bottom:14px}
.ab-card{position:relative;overflow:hidden;max-width:1040px;margin:auto;display:grid;grid-template-columns:200px minmax(0,1fr);gap:44px;align-items:center;padding:42px 46px;background:linear-gradient(135deg,#fff,#faf5ff);border:1px solid var(--line);border-radius:30px;box-shadow:0 24px 60px #6b2c9118}
.ab-card:before,.ab-off:before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:linear-gradient(90deg,#922a8c,#f04f4e)}
.ab-art svg{width:100%;display:block;animation:fl 6s ease-in-out infinite}
.ab-copy h2{font-size:clamp(26px,3.2vw,38px);line-height:1.2;margin-bottom:14px}
.ab-copy p{color:#5b4d73;font-size:16.5px;line-height:1.8;margin:0 0 14px;max-width:none}
.ab-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:60px;align-items:center}
.ab-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.ab-head{max-width:760px;margin:0 auto 34px;text-align:center}
.ab-head p{color:#6a5d80;font-size:17px;line-height:1.75;margin:0 auto}
.ab-off{position:relative;overflow:hidden;max-width:960px;margin:0 auto 30px;background:#fff;border:1px solid var(--line);border-radius:28px;padding:38px 42px;box-shadow:0 22px 56px #6b2c9114}
.ab-off p{color:#5b4d73;font-size:16.5px;line-height:1.8;margin:0 0 12px}
.ab-offh{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:14px}.ab-offh h3{font-size:clamp(22px,2.6vw,28px)}
.ab-pill{font:800 12px Nunito,sans-serif;letter-spacing:.8px;color:#fff;padding:5px 14px;border-radius:99px;background:linear-gradient(120deg,#922a8c,#f04f4e)}
.ab-perks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;max-width:1040px;margin:auto}
.ab-perk{background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px 20px;text-align:center;box-shadow:0 14px 34px #6b2c9110;transition:transform .3s,box-shadow .3s}
.ab-perk:hover{transform:translateY(-6px);box-shadow:0 24px 48px #6b2c9124}
.ab-perk .te{margin:0 auto 16px}.ab-perk h3{font-size:18px;margin-bottom:6px}.ab-perk p{color:#6a5d80;font-size:15px;line-height:1.55;margin:0}
.ab-cta{max-width:1040px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:38px 44px;border-radius:28px;color:#fff;background:linear-gradient(120deg,#2a1450,#6b2c91 55%,#922a8c);box-shadow:0 26px 60px #6b2c9140}
.ab-cta h2{color:#fff;font-size:clamp(24px,3vw,34px);margin-bottom:6px}.ab-cta p{color:#e3d4f5;margin:0}
.ab-cta .ab-acts{margin-top:0}.ab-call{background:#fff!important;color:#6b2c91!important;box-shadow:none}.ab-call .fi{color:#f04f4e}
@media(max-width:1000px){.ab-perks{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:860px){.ab-two{grid-template-columns:minmax(0,1fr);gap:34px}.ab-two .spdbox{max-width:480px;margin:0 auto;width:100%;box-sizing:border-box}
 .ab-card{grid-template-columns:minmax(0,1fr);gap:20px;padding:30px 24px;text-align:center}.ab-art{width:150px;margin:0 auto}.ab-card .ab-copy p{text-align:left}
 .ab-off{padding:30px 22px}.ab-cta{padding:30px 24px;text-align:center;justify-content:center}.ab-cta .ab-acts{justify-content:center}}
@media(max-width:520px){.ab-perks{grid-template-columns:minmax(0,1fr)}.ab-copy p,.ab-off p{font-size:15.5px}.ab-acts .btn{flex:1 1 100%;text-align:center}.ab-copy{text-align:left}}

/* ===== Offerings slider ===== */
.ab-sl{max-width:1040px;margin:0 auto 38px;position:relative}
.ab-tabs{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:20px}
.ab-tabs button{font:800 14px Nunito,sans-serif;color:#6a5d80;background:#fff;border:1px solid var(--line);border-radius:99px;padding:10px 18px;cursor:pointer;transition:all .25s;white-space:nowrap}
.ab-tabs button:hover{color:var(--mag);border-color:#cdbbe8}
.ab-tabs button.on{color:#fff;border-color:transparent;background:linear-gradient(120deg,#922a8c,#f04f4e);box-shadow:0 10px 24px #922a8c40}
.ab-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;outline:none}
.ab-track::-webkit-scrollbar{display:none}
.ab-slide{flex:0 0 100%;min-width:0;scroll-snap-align:center;scroll-snap-stop:always;padding:8px 6px 26px;box-sizing:border-box;display:flex}
.ab-sc{position:relative;overflow:hidden;width:100%;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);background:#fff;border:1px solid var(--line);border-radius:30px;box-shadow:0 26px 64px #6b2c9120}
.ab-side{position:relative;padding:40px 34px;color:#fff;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:12px;background:linear-gradient(150deg,#2a1450,#6b2c91 55%,#922a8c);overflow:hidden}
.ab-side:after{content:"";position:absolute;right:-60px;bottom:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,#f04f4e66,#f04f4e00 70%)}
.ab-ico{width:62px;height:62px;border-radius:20px;display:grid;place-items:center;background:#ffffff22;border:1px solid #ffffff44;backdrop-filter:blur(6px)}
.ab-ico svg.i{width:30px;height:30px;color:#fff}
.ab-num{font:800 44px Montserrat,sans-serif;line-height:1;color:#fff}.ab-num small{font-size:15px;opacity:.6;font-weight:700}
.ab-side h3{color:#fff;font-size:clamp(22px,2.4vw,28px);line-height:1.2}
.ab-side .ab-pill{background:#ffffff26;border:1px solid #ffffff4d}
.ab-body{padding:40px 44px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.ab-body p{color:#5b4d73;font-size:16.5px;line-height:1.8;margin:0 0 14px}
.ab-body .btn{margin-top:8px}
.ab-ctrl{display:flex;align-items:center;justify-content:center;gap:18px}
.ab-arr{width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--mag);font:700 28px/1 Nunito,sans-serif;cursor:pointer;display:grid;place-items:center;padding:0 0 3px;box-shadow:0 10px 24px #6b2c9118;transition:transform .2s,background .2s,color .2s}
.ab-arr:hover{background:linear-gradient(120deg,#922a8c,#f04f4e);color:#fff;transform:scale(1.08)}
.ab-dots{display:flex;gap:8px;align-items:center}
.ab-dots i{width:9px;height:9px;border-radius:99px;background:#d9c2f5;cursor:pointer;transition:all .3s}
.ab-dots i.on{width:28px;background:linear-gradient(90deg,#922a8c,#f04f4e)}
.ab-perks{margin-top:10px}
@media(max-width:860px){.ab-sc{grid-template-columns:minmax(0,1fr);border-radius:24px}
 .ab-side{padding:26px 24px;flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px 14px}.ab-side h3{flex:1 1 100%;order:3}.ab-num{font-size:34px}.ab-ico{width:52px;height:52px;border-radius:16px}
 .ab-body{padding:26px 24px 30px}.ab-body p{font-size:15.5px}
 .ab-tabs{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;padding:2px 2px 6px;margin:0 -2px 14px}.ab-tabs::-webkit-scrollbar{display:none}}
@media(max-width:520px){.ab-slide{padding:6px 2px 22px}.ab-body .btn{width:100%;text-align:center;box-sizing:border-box}.ab-arr{width:44px;height:44px}}

/* offer photos: photo sits under a purple overlay; falls back to the gradient if the file is missing */
.ab-side{background-size:cover;background-position:center;background-repeat:no-repeat}
.ab-side>*{position:relative;z-index:1}
.ab-side h3,.ab-num,.ab-side .ab-pill{text-shadow:0 2px 12px #1a0f2e99}
@media(max-width:860px){.ab-side{min-height:190px}}

/* Bangla hero */
@import url("https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@400;500;600;700&display=swap");
.hero [lang=bn]{font-family:"Hind Siliguri","Nirmala UI","Noto Sans Bengali",Nunito,sans-serif}
.hero h1[lang=bn]{font-size:clamp(38px,5vw,62px);line-height:1.2;letter-spacing:0;font-weight:700}
.hero h1[lang=bn] small{display:block;font:700 .38em Montserrat,sans-serif;color:var(--mag);letter-spacing:.3px;margin-top:8px}
.hero .htxt p.htag{max-width:560px;margin:16px 0 14px;font-size:clamp(18px,1.9vw,23px);line-height:1.55;font-weight:700;color:var(--mag)}
.hero .hcopy{max-width:580px;margin-bottom:26px}
.hero .hcopy p{max-width:none;margin:0 0 12px;font-size:16.5px;line-height:1.85;color:#5b4d73}
.hero .htxt .hcopy{animation:rise .9s .2s cubic-bezier(.2,.7,.2,1) both}.hero .htxt p.htag{animation-delay:.1s}
@media(max-width:900px){
 .hero .htxt p.htag{grid-column:1/-1;grid-row:2;max-width:none;margin:16px 0 8px;font-size:17px;text-align:left}
 .hero .htxt .hcopy{grid-column:1/-1;grid-row:3;max-width:none;margin:0 0 18px;text-align:left}
 .hero .htxt .hcopy p{font-size:15.5px;line-height:1.8;text-align:left}
 .hero .acts{grid-row:4!important}
 .hero h1[lang=bn]{font-size:clamp(25px,7vw,34px)}.hero h1[lang=bn] small{font-size:.42em}
}
@media(min-width:561px) and (max-width:900px){.hero .wrap{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)!important}.hero .netviz{max-width:none!important}.hero .htxt p.htag,.hero .htxt .hcopy p{text-align:left}}

/* ===== Home hero slider: animation -> banners, hover-animated boxes ===== */
.hs{padding-bottom:0!important}
.hs-track{display:flex;align-items:flex-start;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;transition:height .5s cubic-bezier(.2,.7,.2,1)}
.hs-track::-webkit-scrollbar{display:none}
.hs-slide{flex:0 0 100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always;box-sizing:border-box}
.hs-fig{max-width:1180px;margin:0 auto;padding:10px 16px 18px}
.hs-in{position:relative;border-radius:28px;background:#fff;box-shadow:0 26px 70px #6b2c9126;border:1px solid var(--line)}
.hs-in img{display:block;width:100%;height:auto;border-radius:28px}
.hs-box{position:absolute;display:block;box-sizing:border-box;background-repeat:no-repeat;border-radius:16px;opacity:0;pointer-events:auto;cursor:default;
 transition:opacity .25s,transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;overflow:hidden;will-change:transform}
a.hs-box{cursor:pointer}
.hs-box:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,#ffffffaa 50%,transparent 65%);transform:translateX(-120%)}
.hs-box:hover,.hs-box:focus-visible{opacity:1;transform:translateY(-3px) scale(1.07);z-index:3;box-shadow:0 16px 34px #922a8c55,0 0 0 2px #f04f4e88;outline:none}
.hs-box:hover:after,.hs-box:focus-visible:after{transform:translateX(120%);transition:transform .8s ease}
.hs-btn{border-radius:60px}.hs-btn:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 18px 40px #f04f4e66,0 0 0 3px #f04f4e55}
.hs-pill{border-radius:40px}.hs-pill:hover{transform:translateY(-2px) scale(1.04)}
.hs-slide.on .hs-box{animation:hs-pop .75s ease backwards;animation-delay:calc(var(--n)*70ms + .5s)}
@keyframes hs-pop{0%{opacity:0;transform:none}35%{opacity:1;transform:translateY(-3px) scale(1.07);box-shadow:0 14px 30px #922a8c40}100%{opacity:0;transform:none}}
.hs-ctrl{display:flex;align-items:center;justify-content:center;gap:16px;padding:6px 0 22px}
.hs-arr{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--mag);font:700 26px/1 Nunito,sans-serif;cursor:pointer;display:grid;place-items:center;padding:0 0 3px;box-shadow:0 8px 20px #6b2c9118;transition:transform .2s,background .2s,color .2s}
.hs-arr:hover{background:linear-gradient(120deg,#922a8c,#f04f4e);color:#fff;transform:scale(1.1)}
.hs-dots{display:flex;gap:8px;align-items:center}
.hs-dots i{position:relative;width:10px;height:10px;border-radius:99px;background:#d9c2f5;cursor:pointer;overflow:hidden;transition:width .35s,background .35s}
.hs-dots i.on{width:44px}
.hs-dots i.on:after{content:"";position:absolute;inset:0;border-radius:99px;background:linear-gradient(90deg,#922a8c,#f04f4e);transform-origin:left;animation:hs-fill var(--dw,5s) linear forwards}
.hs-dots.hold i.on:after{animation:none;transform:none}
@keyframes hs-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(max-width:900px){.hs-fig{padding:6px 10px 14px}.hs-in,.hs-in img{border-radius:18px}.hs-box{border-radius:9px}.hs-arr{width:38px;height:38px;font-size:22px}.hs-box:hover{transform:translateY(-2px) scale(1.05)}}
@media(prefers-reduced-motion:reduce){.hs-slide.on .hs-box{animation:none}.hs-track{transition:none}}