:root{color-scheme:light}
@font-face{font-family:"ZaaminUr";src:url(zaamin-ur.ttf) format("truetype");font-display:block}
.wm{display:flex;flex-direction:column;line-height:1}.wmu{font:400 24px/1.35 "ZaaminUr","Gulzar",serif;color:var(--ink)}
html[lang="ur"] .brand b{font-family:var(--display)!important;font-weight:700!important}
/* Layout: light glass over soft royal-blue/sky light fields; one column, content cards; RTL flips for Urdu */
:root{
  --ink:#0B2463; --muted:#4A5C86; --royal:#2563EB; --deep:#1E3A8A; --sky:#60D5F0; --green:#0E9F6E;
  --bg:#FFFFFF; --bg2:#F1F5FC; --glass:rgba(255,255,255,.26); --glass-b:rgba(210,222,245,.75); --line:rgba(30,58,138,.12);
  --blob1:rgba(191,219,254,.75); --blob2:rgba(219,234,254,.85); --blob3:rgba(199,210,254,.6);
  --display:"Poppins",system-ui,sans-serif; --body:"Plus Jakarta Sans",system-ui,sans-serif; --ur:"Gulzar","Noto Nastaliq Urdu",serif;
}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.6;overflow-x:hidden}
.bgfx{position:fixed;inset:0;z-index:0;pointer-events:none;background:
 radial-gradient(520px 520px at 90% 4%,var(--blob1),transparent 70%),
 radial-gradient(560px 560px at 4% 28%,var(--blob2),transparent 70%),
 radial-gradient(520px 520px at 96% 60%,var(--blob3),transparent 70%),
 radial-gradient(600px 560px at 8% 92%,var(--blob1),transparent 70%),
 linear-gradient(160deg,var(--bg),var(--bg2))}
.wrap{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:0 40px}
.glass{background:linear-gradient(145deg,var(--glass),rgba(255,255,255,.06));backdrop-filter:blur(12px) saturate(160%);-webkit-backdrop-filter:blur(12px) saturate(160%);border:1.5px solid var(--glass-b);border-radius:22px;box-shadow:0 14px 36px rgba(11,36,99,.07)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--bg)}
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;margin-top:12px;display:flex;align-items:center;gap:14px;padding:10px 16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand img{width:44px;height:auto}
.brand b{font-family:var(--display);font-size:22px;letter-spacing:.2px}
.brand small{display:block;font-size:11px;color:var(--muted);line-height:1}
nav{margin-inline-start:auto;display:flex;gap:18px;align-items:center}
nav a{color:var(--ink);text-decoration:none;font-weight:600;font-size:14px}
.lang{display:flex;border:1.5px solid var(--line);border-radius:99px;overflow:hidden}
.lang button{border:0;background:transparent;color:var(--ink);padding:6px 12px;font:600 13px var(--body);cursor:pointer}
.lang button[aria-pressed="true"]{background:var(--royal);color:#fff}
.lang button:focus-visible,.btn:focus-visible,summary:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:99px;font:700 15px var(--display);text-decoration:none;border:0;cursor:pointer}
.btn.pri{background:linear-gradient(90deg,var(--royal),var(--deep));color:#fff;box-shadow:0 10px 24px rgba(37,99,235,.3)}
.btn.sec{background:var(--glass);color:var(--ink);border:1.5px solid var(--glass-b)}
.navcta{padding:9px 16px;font-size:13px}
.hero{display:grid;grid-template-columns:1.25fr 1fr;gap:26px;margin-top:34px;align-items:center}
.hero > *{min-width:0}
.eyebrow{display:inline-block;font:600 12px var(--body);letter-spacing:1.4px;text-transform:uppercase;color:var(--deep);background:rgba(96,213,240,.25);padding:5px 12px;border-radius:99px}
h1{font-family:var(--display);font-size:clamp(34px,5vw,56px);line-height:1.08;margin:14px 0 12px;text-wrap:balance}
h1 em{font-style:normal;background:linear-gradient(90deg,var(--royal),var(--deep));-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{color:var(--muted);font-size:18px;max-width:56ch}
.ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.checks{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.chip{display:flex;align-items:center;gap:8px;padding:8px 14px;font-weight:600;font-size:14px;border-radius:14px}
.chip i{font-style:normal;color:var(--green);font-weight:800}
.vcard{padding:22px}
.idc{border-radius:20px;padding:18px;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(228,237,253,.92));color:#0B2463;box-shadow:0 20px 44px rgba(11,36,99,.22);direction:ltr}
.idc .top{display:flex;justify-content:space-between;align-items:center}
.idc .top b{font-family:"Poppins",sans-serif;font-size:18px}
.badge{font:800 11px "Plus Jakarta Sans",sans-serif;color:#fff;background:#0E9F6E;padding:4px 10px;border-radius:99px}
.idc .row{display:flex;gap:14px;align-items:center;margin-top:14px}
.ph{width:72px;height:88px;border-radius:12px;background:linear-gradient(160deg,#C7D3E6,#8EA3C2);flex:none}
.idc .meta{font-size:12.5px;line-height:1.7}
.idc .meta b{font-size:15px}
.qr{width:72px;height:72px;margin-left:auto;flex:none;border-radius:8px;background:#fff;padding:5px}
.vcap{margin-top:12px;font-size:13px;color:var(--muted)}
section{margin-top:56px}
h2{font-family:var(--display);font-size:clamp(26px,3.4vw,36px);line-height:1.15;margin:0 0 8px;text-wrap:balance}
.sub{color:var(--muted);margin:0 0 22px;max-width:62ch}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.grid3 > *{min-width:0}
.step{padding:22px}
.num{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--royal);color:#fff;font:700 16px var(--display)}
.step h3,.layer h3{font-family:var(--display);font-size:19px;margin:14px 0 6px}
.step p,.layer p{margin:0;color:var(--muted);font-size:15px}
.layer{padding:22px}
.lico{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:22px;background:rgba(37,99,235,.12);border:1.5px solid rgba(37,99,235,.25)}
.cats{display:flex;flex-wrap:wrap;gap:10px}
.cat{padding:10px 18px;border-radius:14px;font-weight:600}
.price{display:grid;grid-template-columns:1.15fr 1fr;gap:16px}
.price > *{min-width:0}
.pp{padding:26px}
.amt{font:800 clamp(40px,6vw,58px)/1 var(--display);background:linear-gradient(90deg,var(--royal),var(--deep));-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}
.was{font:600 20px var(--display);color:var(--muted);text-decoration:line-through;margin-inline-start:10px}
.tiers{margin-top:14px;display:grid;gap:8px;font-size:14px}
.tiers div{display:flex;justify-content:space-between;gap:10px;padding:8px 12px;border-radius:10px;background:rgba(37,99,235,.07)}
.tiers span:last-child{font-weight:700;font-variant-numeric:tabular-nums}
ul.inc{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:10px}
ul.inc li{display:flex;gap:10px}
ul.inc li::before{content:"✓";color:var(--green);font-weight:800}
.addons{margin-top:16px;padding:20px}
.addons table{width:100%;border-collapse:collapse;font-size:15px}
.addons td{padding:8px 4px;border-bottom:1px solid var(--line)}
.addons td:last-child{text-align:end;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.workers{padding:26px;display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;background:linear-gradient(90deg,rgba(16,185,129,.18),var(--glass))}
.workers > *{min-width:0}
.law{padding:22px;display:flex;gap:16px;align-items:flex-start}
details{padding:16px 20px;margin-bottom:10px}
summary{font-weight:700;cursor:pointer}
details p{color:var(--muted);margin:10px 0 0}
footer{margin-top:56px;padding:22px;display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center;justify-content:space-between;font-size:14px}
footer .tag{font-family:var(--ur);font-size:20px;color:var(--deep)}
.demo-note{margin-top:14px;text-align:center;font-size:12px;color:var(--muted)}
/* Urdu */
html[lang="ur"] body{font-family:var(--ur)}
html[lang="ur"] h1,html[lang="ur"] h2,html[lang="ur"] h3,html[lang="ur"] .btn,html[lang="ur"] nav a{font-family:var(--ur);font-weight:400}
html[lang="ur"] h1{line-height:1.9;font-size:clamp(30px,4.4vw,48px)}
html[lang="ur"] h2{line-height:1.9}
html[lang="ur"] h3{line-height:1.9}
html[lang="ur"] body{line-height:2.1;font-size:19px}
html[lang="ur"] .eyebrow{font-family:var(--ur);letter-spacing:0;text-transform:none;font-size:15px}
html[lang="ur"] .lead{font-size:19px}
html[lang="ur"] *{font-weight:400!important}
html[lang="ur"] .lang button,html[lang="ur"] .idc,html[lang="ur"] .idc *{font-family:var(--body)}
.lang{flex:none}.lang button{white-space:nowrap}
@media (max-width:560px){.brand small{display:none}.navcta{display:none}header{padding:10px 12px}}
@media (max-width:860px){.hero,.price{grid-template-columns:1fr}.grid3{grid-template-columns:1fr}nav a{display:none}.workers{grid-template-columns:1fr}}
@media (prefers-reduced-motion:no-preference){.rise{animation:rise .6s ease both}.rise.d2{animation-delay:.12s}@keyframes rise{from{transform:translateY(10px)}to{transform:none}}}

.lang button{padding:6px 10px}
.foot-links a{color:var(--ink);text-decoration:none;font-weight:600}
.foot-links a:hover{text-decoration:underline}
/* legal pages */
.legal header{justify-content:space-between}
.doc{margin-top:22px;padding:clamp(18px,4vw,40px)}
.doc h1{font-family:var(--display);font-size:clamp(26px,4vw,36px);margin:0 0 6px}
.doc .upd{color:var(--muted);font-size:13px;margin:0 0 18px}
.doc h2{font-size:20px;margin:26px 0 8px}
.doc p,.doc li{max-width:75ch}
.doc ol li,.doc ul li{margin-bottom:8px}
.doc table{width:100%;border-collapse:collapse;font-size:14px;display:block;overflow-x:auto}
.doc th,.doc td{border:1px solid var(--line);padding:8px 10px;text-align:start;vertical-align:top}
.doc .contact{margin-top:24px;font-weight:600}
html[lang="ur"] .doc{font-family:var(--ur);font-size:19px;line-height:2.2}
html[lang="ur"] .doc h1{font-family:var(--ur);font-weight:400}

.rise{animation:none!important}
/* ---- motion (always on: CEO wants visible animation even when the device has Reduce Motion) ---- */
html.js .rv{opacity:0;transform:perspective(900px) translateY(60px) rotateX(14deg) scale(.92);filter:blur(6px);transform-origin:50% 0;
 transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.16,1,.3,1),filter .75s ease;transition-delay:calc(var(--i,0)*110ms);will-change:transform,opacity}
html.js .rv.up{transform:perspective(900px) translateY(-60px) rotateX(-14deg) scale(.92);transform-origin:50% 100%}
html.js .rv.in{opacity:1;transform:none;filter:none}
html.js .glass.rv.in:hover{transform:translateY(-6px) scale(1.015);box-shadow:0 26px 56px rgba(11,36,99,.14)}
html.js header.glass:hover,html.js footer.glass:hover{transform:none}
.btn{transition:transform .25s ease,box-shadow .25s ease}
.btn:hover{transform:translateY(-2px) scale(1.04)}
.tap{animation:tap .5s cubic-bezier(.3,1.6,.5,1)!important}
@keyframes tap{0%{transform:scale(1)}30%{transform:scale(.92)}65%{transform:scale(1.05)}100%{transform:scale(1)}}
.ripple{position:absolute;border-radius:50%;pointer-events:none;z-index:0;background:radial-gradient(circle,rgba(37,99,235,.38),rgba(96,213,240,.2) 55%,transparent 70%);transform:scale(0);animation:rip .7s ease-out forwards}
@keyframes rip{to{transform:scale(1);opacity:0}}
.rp-host{position:relative;overflow:hidden}
details[open] p{animation:open .5s cubic-bezier(.16,1,.3,1) both}
@keyframes open{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
.bgfx{animation:drift 14s ease-in-out infinite alternate}
@keyframes drift{0%{transform:scale(1)}100%{transform:scale(1.12) translate(-2%,2%)}}
h1 em{background-size:220% 100%;animation:sheen 5s ease-in-out infinite}
@keyframes sheen{0%,100%{background-position:0 0}50%{background-position:100% 0}}
.idc{animation:float 5s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-10px)}}
.badge{animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(14,159,110,.45)}50%{box-shadow:0 0 0 8px rgba(14,159,110,0)}}

html{scroll-behavior:smooth}
section,#how,#pricing,#workers{scroll-margin-top:110px}
.brand{-webkit-tap-highlight-color:transparent;border-radius:12px}
.brand:focus{outline:none}
.brand:focus-visible{outline:3px solid var(--sky);outline-offset:4px}
a,button,summary{-webkit-tap-highlight-color:transparent}