/* Reelhaat v1.1 — modern UI: light/dark themes, glass, agency landing, dashboards */
:root{--g:#0B8F66;--lime:#D6F64A;--coral:#FF6A3D;--violet:#7B61FF;
--g2:color-mix(in srgb,var(--g) 78%,#000);--gl:color-mix(in srgb,var(--g) 13%,transparent);--gt:#087A56;
--bg:#F4F3EE;--bg2:#ECEBE4;--sf:#fff;--sf2:#FAF9F5;--ink:#0D1812;--mut:#46534B;--mut2:#5E6B63;--mut3:#8A958E;
--line:rgba(13,24,18,.09);--line2:rgba(13,24,18,.17);--glass:rgba(255,255,255,.66);--glass2:rgba(255,255,255,.82);
--amber:rgba(255,176,32,.2);--amberT:#8A5300;--red:rgba(255,106,61,.16);--redT:#B3340F;--blue:rgba(60,120,220,.14);--blueT:#1F55A6;--grey:rgba(13,24,18,.07);
--sh1:0 1px 2px rgba(13,24,18,.05),0 8px 24px -12px rgba(13,24,18,.14);--sh2:0 30px 60px -30px rgba(13,24,18,.35);
--ff:'Bricolage Grotesque','Hind Siliguri',sans-serif;--fb:'Hind Siliguri',system-ui,-apple-system,'Segoe UI',sans-serif;color-scheme:light}
:root[data-theme=dark]{--gt:#5EE6B0;--gl:color-mix(in srgb,var(--g) 22%,transparent);
--bg:#050C09;--bg2:#09130E;--sf:#0D1913;--sf2:#112119;--ink:#EDF5F0;--mut:#B7C5BD;--mut2:#94A69C;--mut3:#6D7F75;
--line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.17);--glass:rgba(13,25,19,.6);--glass2:rgba(13,25,19,.82);
--amber:rgba(255,176,32,.16);--amberT:#FFC766;--red:rgba(255,106,61,.18);--redT:#FF9A78;--blue:rgba(90,150,255,.16);--blueT:#9CC1FF;--grey:rgba(255,255,255,.08);
--sh1:0 1px 2px rgba(0,0,0,.4),0 8px 24px -12px rgba(0,0,0,.6);--sh2:0 30px 60px -30px rgba(0,0,0,.8);color-scheme:dark}
#rh-app,#rh-app *{box-sizing:border-box}
html{scroll-behavior:smooth}
body.rh-body{margin:0;background:var(--bg);transition:background .35s}
#rh-app{font-family:var(--fb);color:var(--ink);background:var(--bg);font-size:17px;line-height:1.6;overflow-x:clip;min-height:100vh;-webkit-font-smoothing:antialiased;transition:background .35s,color .35s}
:where(#rh-app) a{color:var(--gt);text-decoration:none}
:where(#rh-app) a:hover{color:var(--ink)}
[data-rh-x],:where(#rh-app) :where(h1,h2,h3,h4){font-family:var(--ff);margin:0;letter-spacing:-.03em;line-height:1.05;color:var(--ink)}
:where(#rh-app) p{margin:0}
#rh-app button{font-family:inherit}
#rh-app :focus-visible{outline:2px solid var(--gt);outline-offset:3px}
html[lang=bn] #rh-app h1,html[lang=bn] #rh-app h2,html[lang=bn] #rh-app h3,html[lang=bn] .logo b{font-family:'Hind Siliguri','Bricolage Grotesque',sans-serif;letter-spacing:-.01em;line-height:1.2}
html[lang=bn] .hero h1{line-height:1.15;font-size:clamp(38px,4.4vw,68px);letter-spacing:-.02em}html[lang=bn] .hero h1 .line{flex-wrap:nowrap;white-space:nowrap}html[lang=bn] .hl:after{height:.18em;bottom:.12em}html[lang=bn] .capv{width:1.5em;height:.7em}
.rh-wrap{max-width:1240px;margin:0 auto;padding:0 32px}
.bn{font-family:var(--fb)}.muted{color:var(--mut2)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
svg.i{width:20px;height:20px;flex:none}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1.5px solid transparent;border-radius:999px;padding:12px 22px;font-size:16px;font-weight:600;cursor:pointer;text-decoration:none;transition:background .2s,transform .2s,border-color .2s,opacity .2s,box-shadow .2s;line-height:1.2;font-family:var(--fb);white-space:nowrap}
.btn-p{background:var(--g);color:#fff !important;box-shadow:0 10px 24px -10px var(--g)}
.btn-p:hover{background:var(--g2);transform:translateY(-1px);color:#fff !important}
.btn-l{background:var(--lime);color:#0D1812 !important;box-shadow:0 10px 28px -10px var(--lime)}
.btn-l:hover{transform:translateY(-1px);filter:brightness(1.05);color:#0D1812 !important}
.btn-g{background:transparent;border-color:var(--line2);color:var(--ink) !important}
.btn-g:hover{background:var(--grey);color:var(--ink) !important}
.btn-d{background:transparent;border-color:color-mix(in srgb,var(--coral) 50%,transparent);color:var(--redT) !important}
.btn-d:hover{background:var(--red)}
.btn-lg{padding:16px 30px;font-size:17px}.btn-sm{padding:8px 15px;font-size:14px}.btn-block{width:100%}
.btn[disabled],.btn.busy{opacity:.55;pointer-events:none}
.btn-w{background:#fff;color:#0B6E4F !important}.btn-w:hover{background:#F1F4F2;color:#0B6E4F !important}
.ib{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--glass);color:var(--ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;position:relative;transition:background .2s,transform .2s;padding:0;flex:none}
.ib:hover{background:var(--grey);transform:translateY(-1px)}
.ib svg{width:18px;height:18px}
.ib .ping{position:absolute;right:8px;top:8px;width:9px;height:9px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 2px var(--bg)}
.lang{display:inline-flex;border:1px solid var(--line);border-radius:999px;background:var(--glass);padding:3px;flex:none}
.lang button{border:0;background:transparent;color:var(--mut);font-size:13px;font-weight:700;padding:6px 11px;border-radius:999px;cursor:pointer;line-height:1.1}
.lang button.on{background:var(--ink);color:var(--bg)}
.th-sun{display:none}:root[data-theme=dark] .th-sun{display:block}:root[data-theme=dark] .th-moon{display:none}

/* logo */
.logo{display:flex;align-items:center;gap:10px;color:var(--ink) !important;text-decoration:none;flex:none}
.logo .lm{width:36px;height:36px;border-radius:11px;display:block;flex:none;box-shadow:0 6px 16px -6px var(--g)}
.logo img.lm{object-fit:contain;box-shadow:none;border-radius:8px}
.logo b{font-family:var(--ff);font-weight:700;font-size:21px;letter-spacing:-.04em;color:var(--ink)}
.logo b em{font-style:normal;color:var(--gt)}

/* glass sticky header */
.nav{position:fixed;top:14px;left:0;right:0;z-index:80;display:flex;justify-content:center;padding:0 16px;pointer-events:none}
.nav-in{pointer-events:auto;width:min(1180px,100%);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:9px 12px 9px 18px;border-radius:999px;background:var(--glass);backdrop-filter:blur(22px) saturate(1.6);-webkit-backdrop-filter:blur(22px) saturate(1.6);border:1px solid var(--line);box-shadow:var(--sh1);transition:all .35s cubic-bezier(.2,.7,.2,1)}
.nav.sc .nav-in{width:min(960px,100%);padding:6px 10px 6px 14px;background:var(--glass2);box-shadow:var(--sh2)}
.navlinks{display:flex;gap:4px;font-size:15px;font-weight:500}
.navlinks a{color:var(--mut) !important;padding:8px 14px;border-radius:999px;transition:background .2s,color .2s}
.navlinks a:hover,.navlinks a.on{background:var(--grey);color:var(--ink) !important}
.navr{display:flex;gap:8px;align-items:center}
.burger{display:none}
.mmenu{position:fixed;inset:0;z-index:79;background:var(--bg);padding:96px 24px 24px;display:none;flex-direction:column;gap:6px}
.mmenu.open{display:flex;animation:rhIn .3s both}
.mmenu a.ml{font-family:var(--ff);font-size:30px;font-weight:600;color:var(--ink) !important;padding:10px 4px;border-bottom:1px solid var(--line)}
.mmenu .row{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap;align-items:center}
.avatar{width:38px;height:38px;border-radius:50%;background:var(--gl);color:var(--gt);display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;overflow:hidden;flex:none;object-fit:cover}
img.avatar{display:block}
main.pm{padding-top:104px}

/* hero */
.hero{position:relative;overflow:hidden;padding-top:120px}
.mesh{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.mesh i{position:absolute;border-radius:50%;filter:blur(90px);opacity:.55;animation:rhDrift 18s ease-in-out infinite}
.mesh i:nth-child(1){width:560px;height:560px;left:-120px;top:-60px;background:var(--g)}
.mesh i:nth-child(2){width:420px;height:420px;right:-80px;top:80px;background:var(--lime);opacity:.4;animation-delay:-6s}
.mesh i:nth-child(3){width:380px;height:380px;right:22%;top:420px;background:var(--violet);opacity:.28;animation-delay:-11s}
:root[data-theme=dark] .mesh i{opacity:.32}:root[data-theme=dark] .mesh i:nth-child(2){opacity:.14}:root[data-theme=dark] .mesh i:nth-child(3){opacity:.2}
.hero:after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(var(--line2) 1px,transparent 1.2px);background-size:26px 26px;mask-image:radial-gradient(ellipse at 50% 30%,#000 10%,transparent 70%);-webkit-mask-image:radial-gradient(ellipse at 50% 30%,#000 10%,transparent 70%);opacity:.7}
.hero .rh-wrap{position:relative;z-index:2;padding-top:40px;padding-bottom:64px;display:flex;flex-wrap:wrap;align-items:center;gap:40px}
.hero-l{flex:1 1 500px;min-width:0}
.pillnote{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 8px;border-radius:999px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(10px);font-size:14px;font-weight:600;margin-bottom:26px;color:var(--ink)}
.pillnote b{background:var(--lime);color:#0D1812;border-radius:999px;padding:1px 10px;font-size:12px}
.hero h1{font-weight:700;font-size:clamp(46px,6vw,92px);line-height:.94;letter-spacing:-.05em}
.hero h1 .line{display:flex;align-items:center;gap:.22em;flex-wrap:wrap}
.hero h1 .w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.08em}
.hero h1 .w>span{display:inline-block;animation:rhUp 1s cubic-bezier(.2,.8,.2,1) both}
.capv{display:inline-block;width:1.9em;height:.82em;border-radius:999px;overflow:hidden;position:relative;background:var(--g);box-shadow:0 10px 30px -10px var(--g);transform:rotate(-3deg);vertical-align:middle;flex:none}
.capv video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.grad{background:linear-gradient(100deg,var(--gt),var(--g) 40%,var(--violet) 90%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.hl{position:relative;display:inline-block}
.hl:after{content:'';position:absolute;left:-2%;right:-2%;bottom:.06em;height:.3em;background:var(--lime);z-index:-1;border-radius:6px;transform:scaleX(0);transform-origin:left;animation:rhGrow .9s .9s cubic-bezier(.2,.8,.2,1) forwards;opacity:.9}
.hero-sub{margin-top:28px;max-width:500px;font-size:19px;color:var(--mut)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.hero-note{margin-top:22px;font-size:14px;color:var(--mut2);display:flex;align-items:center;gap:8px}
.proof{display:flex;align-items:center;gap:14px;margin-top:30px;font-size:14px;color:var(--mut2)}
.proof .avs{display:flex}.proof .avs .avatar{width:34px;height:34px;margin-left:-10px;border:2px solid var(--bg);font-size:12px}.proof .avs .avatar:first-child{margin-left:0}
.proof b{color:var(--ink)}
.stage{flex:1 1 500px;min-width:0;position:relative;height:640px}
.reel{position:absolute;will-change:transform}
.reel-in{aspect-ratio:9/16;border-radius:24px;overflow:hidden;position:relative;background:#1a2a22;box-shadow:0 34px 60px -30px rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.18)}
.reel-in video,.reel-in img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.reel .prog{position:absolute;left:10px;right:10px;top:10px;height:3px;border-radius:3px;background:rgba(255,255,255,.35);overflow:hidden;z-index:2}
.reel .prog i{display:block;height:100%;background:#fff;animation:rhProg 8s linear infinite}
.reel .tag{position:absolute;left:10px;top:22px;padding:2px 10px;border-radius:999px;background:rgba(255,255,255,.18);backdrop-filter:blur(10px);color:#fff;font-size:11px;font-weight:600;z-index:2;border:1px solid rgba(255,255,255,.25)}
.reel .cap{position:absolute;left:0;right:0;bottom:0;padding:34px 12px 12px;background:linear-gradient(transparent,rgba(0,0,0,.78));color:#fff;z-index:2}
.reel .cap b{display:block;font-size:11px;font-weight:600}.reel .cap span{display:block;font-size:12px;line-height:1.35}
.reel.big .tag,.reel.big .cap b{font-size:12px}.reel.big .cap span{font-size:14px}
.reel .live{position:absolute;right:12px;top:26px;display:flex;align-items:center;gap:6px;padding:2px 10px;border-radius:999px;background:rgba(255,255,255,.2);backdrop-filter:blur(10px);color:#fff;font-size:12px;font-weight:600;z-index:2}
.reel .live i{width:7px;height:7px;border-radius:50%;background:#FF4D3D;animation:rhBlink 1.6s infinite}
.fl{animation:rhFloat 7s ease-in-out infinite}
.badge-float{display:flex;align-items:center;gap:12px;padding:12px 18px 12px 12px;border-radius:18px;background:var(--glass2);backdrop-filter:blur(18px);border:1px solid var(--line);box-shadow:var(--sh2);white-space:nowrap}
.badge-float i{width:38px;height:38px;border-radius:12px;background:var(--gl);display:flex;align-items:center;justify-content:center;font-style:normal}
.badge-float b{display:block;font-size:15px;line-height:1.2;color:var(--ink)}.badge-float span{font-size:13px;color:var(--mut2)}
@keyframes rhFloat{0%,100%{translate:0 0}50%{translate:0 -12px}}
@keyframes rhProg{from{width:0}to{width:100%}}
@keyframes rhMarq{to{transform:translateX(-50%)}}
@keyframes rhIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes rhUp{from{transform:translateY(110%)}to{transform:none}}
@keyframes rhGrow{to{transform:scaleX(1)}}
@keyframes rhDrift{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,30px) scale(1.12)}}
@keyframes rhBlink{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes rhPop{0%{transform:scale(.94);opacity:0}100%{transform:scale(1);opacity:1}}
@keyframes rhGlow{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--g) 50%,transparent)}50%{box-shadow:0 0 0 10px transparent}}
.in{animation:rhIn 1s cubic-bezier(.2,.7,.2,1) both}.pop{animation:rhPop .35s cubic-bezier(.2,.7,.2,1) both}
.rv{opacity:0;transform:translateY(32px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.rv.vis{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}

/* stats band */
.band{position:relative;z-index:2;margin-top:8px}
.band .rh-wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:var(--glass);backdrop-filter:blur(16px);border:1px solid var(--line);border-radius:28px;padding:10px;box-shadow:var(--sh1)}
.sb{padding:22px 26px;border-right:1px solid var(--line)}.sb:last-child{border:0}
.sb b{display:block;font-family:var(--ff);font-size:clamp(30px,3.6vw,46px);letter-spacing:-.04em;line-height:1;color:var(--ink)}
.sb span{display:block;margin-top:8px;font-size:14px;color:var(--mut2)}
.band .rh-wrap{max-width:1176px}

/* brand marquee */
.trusted{padding:56px 0 8px;text-align:center}
.trusted p{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mut3);margin-bottom:22px}
.mq{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.mq-t{display:flex;gap:56px;width:max-content;animation:rhMarq 38s linear infinite;align-items:center}
.mq:hover .mq-t{animation-play-state:paused}
.bw{display:flex;align-items:center;gap:10px;font-family:var(--ff);font-weight:700;font-size:24px;letter-spacing:-.03em;color:var(--mut2);white-space:nowrap;opacity:.8}
.bw i{width:26px;height:26px;border-radius:8px;background:linear-gradient(135deg,var(--g),var(--violet));display:inline-block;opacity:.85}
.bw:nth-child(3n) i{background:linear-gradient(135deg,var(--coral),var(--lime))}.bw:nth-child(3n+1) i{border-radius:50%}

/* sections */
.sec{padding:112px 0;position:relative}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--gt);letter-spacing:.1em;text-transform:uppercase;margin-bottom:16px}
.eyebrow:before{content:'';width:22px;height:2px;background:var(--lime);border-radius:2px}
.h2{font-size:clamp(36px,4.6vw,64px);font-weight:700;letter-spacing:-.045em;line-height:1}
.lead{font-size:19px;color:var(--mut);max-width:580px;margin-top:18px}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.sec-c{text-align:center}.sec-c .lead{margin-left:auto;margin-right:auto}.sec-c .eyebrow{justify-content:center}

/* showreel */
.reelrow{overflow:hidden;margin-top:44px;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.reelrow-t{display:flex;gap:18px;width:max-content;animation:rhMarq 60s linear infinite;padding:10px 0}
.reelrow:hover .reelrow-t{animation-play-state:paused}
.rtile{width:210px;aspect-ratio:9/15;border-radius:22px;overflow:hidden;position:relative;flex:none;background:#14221b;border:1px solid var(--line);transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.rtile:nth-child(2n){margin-top:34px}.rtile:hover{transform:translateY(-8px) rotate(-1.5deg)}
.rtile video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rtile span{position:absolute;left:10px;bottom:10px;right:10px;color:#fff;font-size:13px;font-weight:600;text-shadow:0 1px 8px rgba(0,0,0,.6);z-index:2}
.rtile:after{content:'';position:absolute;inset:auto 0 0;height:50%;background:linear-gradient(transparent,rgba(0,0,0,.7))}

/* bento */
.bento{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:minmax(190px,auto);gap:16px;margin-top:52px}
.bt{position:relative;border-radius:28px;padding:28px;background:var(--sf);border:1px solid var(--line);overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;transition:transform .4s cubic-bezier(.2,.7,.2,1),border-color .3s;isolation:isolate}
.bt:hover{transform:translateY(-4px);border-color:var(--line2)}
.bt:before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),color-mix(in srgb,var(--g) 22%,transparent),transparent 60%);opacity:0;transition:opacity .3s}
.bt:hover:before{opacity:1}
.bt h3{font-size:24px;margin-bottom:8px}.bt p{color:var(--mut);font-size:16px;max-width:420px}
.bt .ico{width:48px;height:48px;border-radius:15px;background:var(--gl);display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:auto}
.bt.s2{grid-column:span 2}.bt.s3{grid-column:span 3}.bt.s4{grid-column:span 4}.bt.r2{grid-row:span 2}
.bt.acc{background:linear-gradient(150deg,var(--g),color-mix(in srgb,var(--g) 50%,#04120C));color:#fff;border-color:transparent}
.bt.acc h3,.bt.acc p{color:#fff}.bt.acc .ico{background:rgba(255,255,255,.18)}
.bt.lm2{background:var(--lime);border-color:transparent}.bt.lm2 h3,.bt.lm2 p{color:#0D1812}.bt.lm2 .ico{background:rgba(13,24,18,.1)}
.bt .viz{position:absolute;right:22px;top:22px;display:flex;gap:6px;align-items:center}
.mini-bars{display:flex;align-items:flex-end;gap:5px;height:70px}.mini-bars i{width:12px;border-radius:5px;background:rgba(255,255,255,.45);animation:rhBar 2.4s ease-in-out infinite}
.mini-bars i:nth-child(odd){background:#fff}
@keyframes rhBar{0%,100%{transform:scaleY(.55)}50%{transform:scaleY(1)}}.mini-bars i{transform-origin:bottom}
.chipmk{display:inline-flex;align-items:center;gap:6px;background:var(--lime);color:#0D1812;font-size:12px;font-weight:700;border-radius:999px;padding:2px 10px}

/* process */
.how{position:relative;margin-top:64px}
.track{position:absolute;left:26px;right:calc(20% - 42px);top:25px;height:2px;background:var(--line2);border-radius:2px}
.track i{display:block;height:100%;background:linear-gradient(90deg,var(--g),var(--lime));width:0;border-radius:2px}
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;position:relative}
.step .n{width:52px;height:52px;border-radius:50%;border:2px solid var(--line2);background:var(--bg);color:var(--mut2);display:flex;align-items:center;justify-content:center;font-family:var(--ff);font-weight:700;font-size:20px;transition:all .5s}
.step.on .n{background:var(--g);border-color:var(--g);color:#fff;box-shadow:0 0 0 8px var(--gl)}
.step h3{font-size:22px;margin:20px 0 8px;letter-spacing:-.02em}.step p{font-size:16px;color:var(--mut)}

/* creators grid */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:32px}
.chip{padding:8px 18px;border-radius:999px;border:1.5px solid var(--line2);background:transparent;color:var(--ink);font-size:15px;font-weight:500;cursor:pointer;font-family:var(--fb);transition:all .2s}
.chip:hover{border-color:var(--gt)}
.chip.on{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:40px}
.ccard{display:block;background:var(--sf);border:1px solid var(--line);border-radius:24px;overflow:hidden;color:inherit !important;transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s,border-color .3s;cursor:pointer}
.ccard:hover{transform:translateY(-6px);box-shadow:var(--sh2);border-color:var(--line2)}
.cvid{position:relative;aspect-ratio:9/13;background:#14221b;overflow:hidden}
.cvid video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.ccard:hover .cvid video{transform:scale(1.05)}
.cvid .tag{position:absolute;left:12px;top:12px;padding:2px 11px;border-radius:999px;background:rgba(255,255,255,.2);backdrop-filter:blur(10px);color:#fff;border:1px solid rgba(255,255,255,.25);font-size:12px;font-weight:600}
.cvid .cnt{position:absolute;right:12px;top:12px;padding:2px 10px;border-radius:999px;background:rgba(0,0,0,.5);color:#fff;font-size:12px;font-weight:600}
.cbody{padding:16px 18px 18px}
.crow{display:flex;gap:12px;align-items:center}.crow b{display:block;font-size:17px;line-height:1.25}.crow span{font-size:14px;color:var(--mut2)}
.cfoot{display:flex;justify-content:space-between;align-items:center;margin-top:14px;padding-top:14px;border-top:1px solid var(--line);font-size:14px;color:var(--mut2)}
.cfoot b{font-family:var(--ff);font-size:19px;color:var(--ink)}
.star{color:#E9A21A}
.empty{padding:64px 24px;text-align:center;color:var(--mut2);border:1.5px dashed var(--line2);border-radius:22px;margin-top:40px}

/* dark showcase panel (escrow) */
.panel{border-radius:40px;background:#07120D;color:#EAF3EE;padding:72px 64px;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.panel:before{content:'';position:absolute;width:640px;height:640px;right:-160px;top:-200px;background:radial-gradient(circle,color-mix(in srgb,var(--g) 55%,transparent),transparent 65%);pointer-events:none}
.panel:after{content:'';position:absolute;width:420px;height:420px;left:-120px;bottom:-200px;background:radial-gradient(circle,color-mix(in srgb,var(--violet) 40%,transparent),transparent 65%);pointer-events:none}
.panel h2,.panel h3{color:#fff !important}.panel .lead{color:#B7C5BD}.panel .eyebrow{color:#7DF5C4}
.esc{display:flex;flex-wrap:wrap;gap:56px;align-items:center;position:relative;z-index:2}.esc>div{flex:1 1 420px;min-width:0}
.paylogos{display:flex;gap:10px;margin-top:28px;flex-wrap:wrap}
.paylogos span{padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);font-size:14px;font-weight:600}
.ecard{background:rgba(255,255,255,.06);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.14);border-radius:28px;padding:28px;max-width:480px;margin:0 auto}
.ecard .row{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.ecard h3{font-size:24px}.ecard small{color:#8FA398;font-size:13px}
.ecard .amt{font-family:var(--ff);font-size:34px;font-weight:700;color:var(--lime)}
.estep{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:14px;margin-top:10px;transition:all .4s;color:#8FA398}
.estep i{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:13px;font-weight:700;box-shadow:inset 0 0 0 1.5px #3A4E43;flex:none;transition:all .4s}
.estep.on{background:rgba(255,255,255,.08);color:#F2F7F4}.estep.on i{background:var(--g);box-shadow:none;color:#fff;animation:rhGlow 2s infinite}
.estep.done i{background:var(--g);box-shadow:none;color:#fff}.estep.done{color:#F2F7F4}
.ecard .foot{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.12);font-size:14px;color:#8FA398}

/* usage */
.usage{display:flex;flex-wrap:wrap;gap:64px;align-items:center}.usage>div{flex:1 1 420px;min-width:0}
.ucard{background:var(--sf);border:1px solid var(--line);border-radius:28px;padding:28px;max-width:500px;box-shadow:var(--sh2)}
.ucard header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.ucard h3{font-size:22px}
.urow{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-top:1px solid var(--line);font-size:16px}
.urow span{color:var(--mut2)}.urow b{text-align:right;font-weight:600}
.okpill{display:inline-flex;align-items:center;gap:6px;padding:3px 12px;border-radius:999px;background:var(--gl);color:var(--gt);font-size:13px;font-weight:600}

/* services */
.svcs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px}
.svc{background:var(--sf);border:1px solid var(--line);border-radius:28px;padding:30px;display:flex;flex-direction:column;gap:10px;transition:transform .4s,border-color .3s,box-shadow .4s}
.svc:hover{transform:translateY(-6px);border-color:var(--line2);box-shadow:var(--sh2)}
.svc .ico{width:56px;height:56px;border-radius:18px;background:var(--gl);display:flex;align-items:center;justify-content:center;font-size:26px;margin-bottom:10px}
.svc h3{font-size:24px}.svc p{color:var(--mut);font-size:16px;flex:1}.svc .pr{font-weight:700;color:var(--gt);margin-top:6px;font-size:15px}
.leadbox{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:22px;border-radius:32px;overflow:hidden;border:1px solid var(--line);background:var(--sf)}
.leadbox .lb-l{padding:44px;background:linear-gradient(150deg,var(--g),color-mix(in srgb,var(--g) 45%,#04120C));color:#fff}
.leadbox .lb-l h3{color:#fff;font-size:34px;margin-bottom:12px}.leadbox .lb-l p{color:rgba(255,255,255,.85)}
.leadbox .lb-r{padding:36px 40px}

/* pricing */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:52px;align-items:stretch}
.plan{background:var(--sf);border:1px solid var(--line);border-radius:30px;padding:34px;display:flex;flex-direction:column;position:relative;transition:transform .4s}
.plan:hover{transform:translateY(-6px)}
.plan.feat{background:linear-gradient(160deg,#0B1F16,#06110C);color:#EAF3EE;border-color:color-mix(in srgb,var(--g) 60%,transparent);box-shadow:0 30px 70px -30px var(--g)}
.plan.feat h3,.plan.feat .pp{color:#fff}.plan.feat li{color:#C9D6CF}
.plan .bdg{position:absolute;top:-13px;left:34px;background:var(--lime);color:#0D1812;font-size:12px;font-weight:800;border-radius:999px;padding:3px 14px}
.plan h3{font-size:22px}.plan .pp{font-family:var(--ff);font-size:46px;font-weight:700;letter-spacing:-.04em;margin:14px 0 2px;color:var(--ink)}.plan .per{color:var(--mut2);font-size:14px}
.plan ul{list-style:none;margin:22px 0 28px;padding:0;display:grid;gap:11px;flex:1}
.plan li{display:flex;gap:10px;font-size:16px;color:var(--mut);line-height:1.4}.plan li:before{content:'✓';color:var(--gt);font-weight:800;flex:none}
.plan.feat li:before{color:var(--lime)}

/* testimonials */
.tsts{columns:3;column-gap:18px;margin-top:48px}
.tst{break-inside:avoid;margin-bottom:18px;background:var(--sf);border:1px solid var(--line);border-radius:26px;padding:26px}
.tst p{font-size:17px;color:var(--ink);line-height:1.55}.tst .by{display:flex;align-items:center;gap:12px;margin-top:20px}.tst .by b{display:block;font-size:15px;line-height:1.2}.tst .by span{font-size:13px;color:var(--mut2)}
.tst .st{color:#E9A21A;letter-spacing:2px;font-size:14px;margin-bottom:10px}

/* faq */
.faq{max-width:860px;margin:40px auto 0}
.faq details{border:1px solid var(--line);background:var(--sf);border-radius:22px;padding:6px 26px;margin-bottom:12px;transition:border-color .3s}
.faq details[open]{border-color:color-mix(in srgb,var(--g) 50%,transparent)}
.faq summary{cursor:pointer;font-family:var(--ff);font-size:20px;font-weight:600;letter-spacing:-.02em;list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:18px 0}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:'+';font-size:28px;color:var(--gt);transition:transform .25s;line-height:1}
.faq details[open] summary:after{transform:rotate(45deg)}
.faq p{padding:0 0 20px;color:var(--mut);max-width:700px}

/* giant CTA + footer */
.ctabig{border-radius:44px;background:linear-gradient(135deg,var(--g),color-mix(in srgb,var(--g) 40%,#03100A));padding:88px 56px;text-align:center;position:relative;overflow:hidden;color:#fff}
.ctabig:before{content:'';position:absolute;width:520px;height:520px;left:50%;top:-260px;transform:translateX(-50%);background:radial-gradient(circle,var(--lime),transparent 65%);opacity:.55;pointer-events:none}
.ctabig h2{color:#fff;font-size:clamp(38px,5.6vw,84px);letter-spacing:-.05em;position:relative;max-width:900px;margin:0 auto}
.ctabig p{position:relative;font-size:19px;margin:20px auto 0;max-width:560px;color:rgba(255,255,255,.88)}
.ctabig .acts{position:relative;display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:36px}
footer.foot{padding:72px 0 0;font-size:15px;color:var(--mut2);overflow:hidden}
footer.foot .fr{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:center;padding-bottom:28px;border-bottom:1px solid var(--line)}
footer.foot nav{display:flex;gap:24px;flex-wrap:wrap}footer.foot a{color:var(--mut) !important}footer.foot a:hover{color:var(--ink) !important}
footer.foot .cp{padding:22px 0;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:14px}
.wordmark{font-family:var(--ff);font-weight:800;font-size:clamp(80px,19vw,300px);letter-spacing:-.07em;line-height:.8;text-align:center;white-space:nowrap;color:transparent;-webkit-text-stroke:1.5px var(--line2);user-select:none;margin:6px 0 -.1em;background:linear-gradient(180deg,var(--line2),transparent 80%);-webkit-background-clip:text;background-clip:text}

/* forms */
.field{display:block;margin-bottom:18px}
.field>label,.lab{display:block;font-size:14px;font-weight:600;margin-bottom:6px;color:var(--ink)}
.field small{display:block;margin-top:6px;color:var(--mut2);font-size:13px;line-height:1.4}
.input,.select,.textarea{width:100%;padding:12px 15px;border:1.5px solid var(--line2);border-radius:15px;background:var(--sf);font:inherit;font-size:16px;color:var(--ink);transition:border-color .2s,box-shadow .2s}
.input::placeholder,.textarea::placeholder{color:var(--mut3)}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--g);box-shadow:0 0 0 4px var(--gl)}
.textarea{min-height:96px;resize:vertical}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.seg{display:flex;gap:6px;flex-wrap:wrap}
.seg button{padding:9px 16px;border-radius:12px;border:1.5px solid var(--line2);background:var(--sf);font-size:15px;font-weight:500;cursor:pointer;color:var(--ink)}
.seg button.on{border-color:var(--g);background:var(--gl);color:var(--gt);font-weight:600}
.err{background:var(--red);color:var(--redT);padding:10px 14px;border-radius:12px;font-size:15px;margin-bottom:16px}
.okmsg{background:var(--gl);color:var(--gt);padding:12px 16px;border-radius:12px;font-size:15px;margin-bottom:16px}
input[type=range]{width:100%;accent-color:var(--g)}
.auth{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:110px 20px 48px;position:relative}
.authc{width:100%;max-width:480px;background:var(--glass2);backdrop-filter:blur(20px);border:1px solid var(--line);border-radius:32px;padding:38px;box-shadow:var(--sh2);position:relative;z-index:2}
.authc.wide{max-width:640px}.authc h1{font-size:36px;letter-spacing:-.04em}
.tabs{display:flex;gap:6px;background:var(--grey);border-radius:15px;padding:5px;margin:22px 0}
.tabs a,.tabs button{flex:1;text-align:center;padding:10px;border-radius:11px;font-weight:600;font-size:15px;color:var(--mut) !important;background:transparent;border:0;cursor:pointer}
.tabs .on{background:var(--sf);color:var(--ink) !important;box-shadow:var(--sh1)}
.demo{margin-top:22px;padding-top:20px;border-top:1px dashed var(--line2)}.demo p{font-size:14px;color:var(--mut2);margin-bottom:10px}.demo .btns{display:flex;gap:10px;flex-wrap:wrap}

/* app shell */
.shell{display:flex;min-height:100vh;background:var(--bg)}
.side{width:252px;flex:none;background:var(--sf);border-right:1px solid var(--line);padding:20px 14px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.side .logo{padding:2px 10px 20px}.side .btn{margin:0 4px 16px}
.nv{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;color:var(--mut) !important;font-weight:500;font-size:16px;transition:background .2s;position:relative;margin-bottom:2px}
.nv:hover{background:var(--grey);color:var(--ink) !important}
.nv.on{background:var(--gl);color:var(--gt) !important;font-weight:600}
.nv svg{width:20px;height:20px;flex:none}
.nv .dot{margin-left:auto;background:var(--coral);color:#fff;border-radius:999px;font-size:12px;padding:0 8px;font-weight:700;line-height:20px}
.side .sk{display:flex;align-items:center;gap:8px;margin:0 4px 14px;padding:9px 12px;border-radius:14px;border:1px solid var(--line);background:var(--bg);color:var(--mut2);font-size:14px;cursor:pointer;width:calc(100% - 8px)}
.side .sk kbd{margin-left:auto;font:600 11px var(--fb);border:1px solid var(--line2);border-radius:6px;padding:1px 6px;color:var(--mut2)}
.side .me{margin-top:auto;display:flex;align-items:center;gap:10px;padding:14px 10px 0;border-top:1px solid var(--line)}
.side .me b{display:block;font-size:15px;line-height:1.2}.side .me small{color:var(--mut2);font-size:13px}
.side .me button{margin-left:auto;background:none;border:0;color:var(--mut2);cursor:pointer;font-size:13px;text-decoration:underline}
.main{flex:1;min-width:0}
.topbar{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:10px;padding:12px 40px;background:var(--glass);backdrop-filter:blur(20px) saturate(1.5);-webkit-backdrop-filter:blur(20px) saturate(1.5);border-bottom:1px solid var(--line)}
.topbar .tl{display:none}
.tb-search{display:flex;align-items:center;gap:10px;flex:1;max-width:420px;padding:9px 14px;border-radius:999px;border:1px solid var(--line);background:var(--glass);color:var(--mut2);font-size:15px;cursor:pointer;text-align:left}
.tb-search kbd{margin-left:auto;font:600 11px var(--fb);border:1px solid var(--line2);border-radius:6px;padding:1px 6px}
.topbar .sp{flex:1}
.page{padding:28px 40px 90px}
.pmenu{position:absolute;right:0;top:48px;width:340px;background:var(--sf);border:1px solid var(--line);border-radius:22px;box-shadow:var(--sh2);padding:10px;z-index:90;animation:rhPop .2s both;text-align:left}
.pmenu h4{font-size:15px;padding:8px 10px;letter-spacing:-.01em}
.pmenu a.it,.pmenu button.it{display:flex;gap:12px;align-items:flex-start;padding:10px;border-radius:14px;color:var(--ink) !important;background:transparent;border:0;width:100%;text-align:left;cursor:pointer;font-size:15px;line-height:1.35}
.pmenu a.it:hover,.pmenu button.it:hover{background:var(--grey)}
.pmenu .em{padding:22px 10px;text-align:center;color:var(--mut2);font-size:14px}
.pmenu .ndot{width:9px;height:9px;border-radius:50%;background:var(--coral);margin-top:7px;flex:none}
.pmenu small{display:block;color:var(--mut2);font-size:13px}
.relw{position:relative}
.pagehead{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:26px}
.pagehead h1{font-size:36px;letter-spacing:-.04em}.pagehead p{color:var(--mut2);margin-top:6px}
.crumb{font-size:14px;color:var(--mut2);margin-bottom:8px}.crumb a{color:var(--mut2) !important}.crumb a:hover{color:var(--gt) !important}
.card{background:var(--sf);border:1px solid var(--line);border-radius:24px;padding:24px}
.card h3{font-size:20px;letter-spacing:-.02em;margin-bottom:14px}.card+.card{margin-top:16px}
.banner{border-radius:20px;padding:16px 20px;margin-bottom:16px;background:var(--amber);color:var(--ink);border:1px solid color-mix(in srgb,#FFB020 35%,transparent)}
.banner.ok{background:var(--gl);border-color:color-mix(in srgb,var(--g) 35%,transparent)}.banner.bad{background:var(--red);border-color:color-mix(in srgb,var(--coral) 35%,transparent)}
.banner.row{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
.pill{display:inline-flex;align-items:center;padding:3px 12px;border-radius:999px;font-size:13px;font-weight:600;white-space:nowrap}
.p-amber{background:var(--amber);color:var(--amberT)}.p-red{background:var(--red);color:var(--redT)}.p-blue{background:var(--blue);color:var(--blueT)}.p-green{background:var(--gl);color:var(--gt)}.p-grey{background:var(--grey);color:var(--mut2)}

/* dashboard widgets */
.hello{position:relative;border-radius:32px;padding:34px 36px;margin-bottom:20px;overflow:hidden;background:linear-gradient(135deg,var(--g),color-mix(in srgb,var(--g) 40%,#03100A));color:#fff;display:flex;justify-content:space-between;gap:20px;align-items:center;flex-wrap:wrap}
.hello:before{content:'';position:absolute;width:380px;height:380px;right:-80px;top:-160px;background:radial-gradient(circle,var(--lime),transparent 65%);opacity:.5}
.hello h1{color:#fff;font-size:clamp(28px,3.2vw,40px);position:relative}.hello p{color:rgba(255,255,255,.85);margin-top:6px;position:relative}.hello .btn{position:relative}
.hello .big{font-family:var(--ff);font-size:44px;font-weight:700;letter-spacing:-.04em;line-height:1}
.hello small{color:rgba(255,255,255,.75);font-size:14px}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px}
.kpi{background:var(--sf);border:1px solid var(--line);border-radius:24px;padding:20px 22px;position:relative;overflow:hidden;transition:transform .3s,border-color .3s}
.kpi:hover{transform:translateY(-3px);border-color:var(--line2)}
.kpi span.l{font-size:14px;color:var(--mut2);display:flex;align-items:center;gap:8px}
.kpi span.l i{width:26px;height:26px;border-radius:9px;background:var(--gl);display:inline-flex;align-items:center;justify-content:center;color:var(--gt);font-style:normal}
.kpi span.l i svg{width:14px;height:14px}
.kpi b{display:block;font-family:var(--ff);font-size:32px;letter-spacing:-.04em;margin-top:12px;line-height:1.05}
.kpi .spark{position:absolute;right:0;bottom:0;width:55%;height:46px;opacity:.9}
.kpi .dl{display:inline-flex;font-size:12px;font-weight:700;border-radius:999px;padding:1px 8px;margin-left:6px;vertical-align:middle;background:var(--gl);color:var(--gt)}
.grid2{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:16px;margin-bottom:16px;align-items:start}
.card h3 .sub{font-size:13px;color:var(--mut2);font-weight:500;letter-spacing:0;font-family:var(--fb);margin-left:8px}
.chart{width:100%;height:210px;display:block}
.chart .bar{fill:url(#bg1);transition:opacity .2s}.chart .bar:hover{opacity:.75}
.chart text{fill:var(--mut2);font:600 11px var(--fb)}.chart line{stroke:var(--line);stroke-width:1}
.board{display:grid;grid-template-columns:repeat(4,minmax(190px,1fr));gap:12px;overflow-x:auto;padding-bottom:6px}
.bcol{background:var(--bg2);border-radius:20px;padding:10px;min-height:150px}
.bcol h4{font-size:13px;font-weight:700;letter-spacing:0;display:flex;align-items:center;justify-content:space-between;padding:6px 8px 10px;color:var(--mut)}
.bcol h4 em{font-style:normal;background:var(--sf);border-radius:999px;padding:0 9px;font-size:12px;color:var(--ink);line-height:20px}
.bcol h4:before{content:'';width:8px;height:8px;border-radius:50%;background:var(--c,var(--mut3));margin-right:8px;flex:none}
.bcol h4 span{flex:1}
.kcard{display:flex;gap:10px;align-items:center;background:var(--sf);border:1px solid var(--line);border-radius:16px;padding:9px;margin-bottom:8px;color:inherit !important;transition:transform .2s,box-shadow .2s}
.kcard:hover{transform:translateY(-2px);box-shadow:var(--sh1)}
.kcard .kt{width:36px;height:48px;border-radius:9px;overflow:hidden;background:#14221b;flex:none;position:relative}
.kcard .kt video,.kcard .kt img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.kcard b{display:block;font-size:14px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.kcard small{color:var(--mut2);font-size:12px}
.todo{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.todo li a,.todo li div{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:14px;background:var(--bg2);color:var(--ink) !important;font-size:15px;line-height:1.3}
.todo li a:hover{background:var(--grey)}
.todo .ck{width:22px;height:22px;border-radius:50%;border:2px solid var(--line2);flex:none;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px}
.todo li.ok .ck{background:var(--g);border-color:var(--g)}.todo li.ok{opacity:.6}.todo li.ok a,.todo li.ok div{text-decoration:line-through}
.todo small{display:block;color:var(--mut2);font-size:12px}
.ringw{display:flex;gap:18px;align-items:center}
.ring{width:84px;height:84px;flex:none;position:relative}.ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:9;stroke-linecap:round}.ring .t{stroke:var(--grey)}.ring .v{stroke:var(--g);transition:stroke-dashoffset 1.2s cubic-bezier(.2,.7,.2,1)}
.ring b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--ff);font-size:20px}
.ftabs{display:flex;gap:6px;margin-bottom:18px;flex-wrap:wrap}
.sechead{display:flex;justify-content:space-between;align-items:center;margin:28px 0 14px}.sechead h2{font-size:22px;letter-spacing:-.02em}
.orow{display:flex;align-items:center;gap:16px;padding:14px;border-radius:20px;background:var(--sf);border:1px solid var(--line);color:inherit !important;transition:box-shadow .2s,border-color .2s,transform .2s;margin-bottom:10px}
.orow:hover{border-color:var(--line2);box-shadow:var(--sh1);transform:translateY(-1px)}
.othumb{width:54px;height:72px;border-radius:13px;overflow:hidden;background:#14221b;flex:none;position:relative}
.othumb video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.omid{flex:1;min-width:0}.omid b{display:block;font-size:17px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.omid span{font-size:14px;color:var(--mut2)}
.oright{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:6px}.oright b{font-family:var(--ff);font-size:18px}
.tab-bottom{display:none}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:24px}
.stat{background:var(--sf);border:1px solid var(--line);border-radius:22px;padding:18px 20px}.stat span{font-size:14px;color:var(--mut2)}.stat b{display:block;font-family:var(--ff);font-size:30px;letter-spacing:-.03em;margin-top:2px}

/* command palette */
.cmdbg{position:fixed;inset:0;z-index:250;background:rgba(3,10,7,.55);backdrop-filter:blur(6px);display:flex;justify-content:center;align-items:flex-start;padding:12vh 16px 16px}
.cmd{width:min(620px,100%);background:var(--sf);border:1px solid var(--line2);border-radius:26px;box-shadow:var(--sh2);overflow:hidden;animation:rhPop .2s both}
.cmd input{width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;padding:20px 24px;font:inherit;font-size:18px;color:var(--ink);outline:none}
.cmd .lst{max-height:52vh;overflow:auto;padding:8px}
.cmd h5{margin:10px 14px 4px;font:700 12px var(--fb);letter-spacing:.08em;text-transform:uppercase;color:var(--mut3)}
.cmd .ci{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:14px;cursor:pointer;color:var(--ink);font-size:16px;border:0;background:transparent;width:100%;text-align:left}
.cmd .ci.sel{background:var(--gl)}.cmd .ci small{margin-left:auto;color:var(--mut2);font-size:13px}.cmd .ci svg{width:18px;height:18px;color:var(--gt)}
.cmd .ft{display:flex;gap:16px;padding:10px 18px;border-top:1px solid var(--line);font-size:12px;color:var(--mut2)}

/* order workspace */
.wsgrid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:24px;align-items:start}
.playerwrap{display:flex;gap:28px;align-items:flex-start}.phone{width:300px;flex:none}
.player{position:relative;aspect-ratio:9/16;border-radius:30px;overflow:hidden;background:#111;box-shadow:var(--sh2);border:1px solid var(--line2)}
.player video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.player .ptop{position:absolute;left:12px;right:12px;top:12px;display:flex;justify-content:space-between;z-index:2}
.player .ptop span{padding:2px 11px;border-radius:999px;background:rgba(255,255,255,.2);backdrop-filter:blur(10px);color:#fff;border:1px solid rgba(255,255,255,.25);font-size:12px;font-weight:600}
.player .pcap{position:absolute;left:0;right:0;bottom:0;padding:40px 14px 14px;background:linear-gradient(transparent,rgba(0,0,0,.8));color:#fff;z-index:2;pointer-events:none}.player .pcap b{font-size:12px;display:block}
.pplay{position:absolute;inset:0;background:transparent;border:0;cursor:pointer;z-index:1;display:flex;align-items:center;justify-content:center}
.pplay span{width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.92);display:flex;align-items:center;justify-content:center;transition:opacity .2s,transform .2s}
.player.playing .pplay span{opacity:0;transform:scale(.8)}
.scrub{position:relative;height:22px;margin-top:14px;cursor:pointer}
.scrub .bar{position:absolute;left:0;right:0;top:9px;height:4px;border-radius:4px;background:var(--line2)}.scrub .bar i{display:block;height:100%;width:0;background:var(--g);border-radius:4px}
.scrub .mk{position:absolute;top:2px;width:10px;height:18px;margin-left:-5px;border-radius:5px;background:var(--lime);border:2px solid var(--sf);box-shadow:0 1px 3px rgba(0,0,0,.4);cursor:pointer;padding:0}
.ptime{display:flex;justify-content:space-between;font-size:14px;color:var(--mut2);margin-top:6px;font-variant-numeric:tabular-nums}
.pctl{display:flex;gap:8px;margin-top:12px}
.cmbox{flex:1;min-width:0}.cmlist{max-height:360px;overflow:auto;margin:0 -6px;padding:0 6px}
.cm{display:flex;gap:12px;padding:12px;border-radius:14px;cursor:pointer;transition:background .2s;border:0;background:transparent;width:100%;text-align:left;font:inherit;color:inherit}
.cm:hover{background:var(--grey)}
.cm .t{flex:none;font-variant-numeric:tabular-nums;font-weight:700;color:var(--gt);background:var(--gl);border-radius:8px;padding:0 8px;height:26px;line-height:26px;font-size:14px}
.cm b{display:block;font-size:14px;line-height:1.3}.cm span{font-size:16px;line-height:1.4;display:block}
.cadd{display:flex;gap:8px;margin-top:12px}.cadd .input{padding:10px 14px}
.draftbar{display:flex;gap:6px;margin-bottom:14px}
.dark-card{background:linear-gradient(160deg,#0B1F16,#06110C);color:#EAF3EE;border-radius:26px;padding:24px;border:1px solid rgba(255,255,255,.08)}
.dark-card h3{color:#fff;font-size:20px}.dark-card .amt{font-family:var(--ff);font-size:38px;font-weight:700;letter-spacing:-.03em;margin:4px 0 8px;color:var(--lime)}
.dark-card small{color:#8FA398}.dark-card .estep{margin-top:6px;padding:8px 10px;font-size:15px}.dark-card .estep i{width:24px;height:24px;font-size:12px}
.pcard{display:flex;gap:12px;align-items:center}
.kv{display:grid;gap:12px}.kv dt{font-size:13px;color:var(--mut2);font-weight:600}.kv dd{margin:0;font-size:16px;line-height:1.4}
.payopts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px}
.payopt{border:1.5px solid var(--line2);border-radius:16px;padding:14px 8px;text-align:center;font-weight:600;cursor:pointer;background:var(--sf);color:var(--ink);font-size:15px;transition:all .2s}
.payopt.on{border-color:var(--g);background:var(--gl);color:var(--gt)}
.payopt i{display:block;width:34px;height:34px;border-radius:10px;margin:0 auto 6px;font-style:normal;font-weight:800;color:#fff;line-height:34px;font-size:15px}
.notice{background:var(--bg2);border:1px dashed var(--line2);border-radius:14px;padding:12px 14px;font-size:14px;color:var(--mut)}
.timeline{list-style:none;margin:0;padding:0 0 0 18px;border-left:2px solid var(--line)}
.timeline li{position:relative;padding:0 0 14px 14px;font-size:15px;color:var(--mut)}
.timeline li:before{content:'';position:absolute;left:-25px;top:7px;width:10px;height:10px;border-radius:50%;background:var(--g);border:2px solid var(--sf)}
.timeline small{display:block;color:var(--mut3);font-size:12px}
.msgs{display:flex;flex-direction:column;gap:8px;max-height:280px;overflow:auto;margin-bottom:12px}
.msg{max-width:88%;padding:9px 14px;border-radius:16px;font-size:15px;line-height:1.4;background:var(--grey);align-self:flex-start}
.msg.me{align-self:flex-end;background:var(--gl)}.msg small{display:block;font-size:11px;color:var(--mut3);margin-top:2px}
.waiting{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:56px 24px;background:var(--sf);border:1px dashed var(--line2);border-radius:26px}
.waiting .ic{width:60px;height:60px;border-radius:50%;background:var(--gl);display:flex;align-items:center;justify-content:center}
.uploadbox{border:2px dashed var(--line2);border-radius:18px;padding:22px;text-align:center;background:var(--bg2)}.uploadbox.has{border-style:solid;border-color:var(--g);background:var(--gl)}
.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.vitem{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:9/14;background:#14221b;border:2px solid transparent}
.vitem video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vitem .x{position:absolute;right:6px;top:6px;width:28px;height:28px;border-radius:50%;background:rgba(0,0,0,.65);color:#fff;border:0;cursor:pointer;font-size:16px;line-height:1;z-index:2}
.vitem .cp{position:absolute;left:0;right:0;bottom:0;padding:18px 8px 8px;background:linear-gradient(transparent,rgba(0,0,0,.8));color:#fff;font-size:12px;line-height:1.3}
.vitem.pick{cursor:pointer}.vitem.pick.on{border-color:var(--lime)}
.lib{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px}
.libi{background:var(--sf);border:1px solid var(--line);border-radius:22px;overflow:hidden}
.libi .v{position:relative;aspect-ratio:9/14;background:#14221b}.libi .v video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.libi .b{padding:12px 14px}.libi .b b{display:block;font-size:16px}.libi .b span{font-size:13px;color:var(--mut2)}

/* wizard / profile / wallet */
.wz{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:28px;align-items:start}
.wstep{display:flex;gap:10px;align-items:center;margin-bottom:22px;font-size:15px;font-weight:600;color:var(--mut3);flex-wrap:wrap}.wstep span{display:flex;align-items:center;gap:8px}
.wstep i{width:26px;height:26px;border-radius:50%;border:2px solid var(--line2);display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:13px}
.wstep .on{color:var(--ink)}.wstep .on i,.wstep .done i{background:var(--g);border-color:var(--g);color:#fff}
.tpl{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.sumcard{position:sticky;top:96px}
.sumrow{display:flex;justify-content:space-between;padding:8px 0;font-size:15px;color:var(--mut)}
.sumrow.t{border-top:1px solid var(--line);margin-top:6px;padding-top:14px;font-weight:700;color:var(--ink);font-size:18px}
.chk{display:flex;gap:10px;align-items:flex-start;font-size:15px;margin:18px 0;cursor:pointer}.chk input{margin-top:5px;width:18px;height:18px;accent-color:var(--g)}
.prof{display:grid;grid-template-columns:340px minmax(0,1fr);gap:48px;padding:40px 0 96px;align-items:start}
.prof-side{position:sticky;top:104px}
.prof-side .pic{width:96px;height:96px;border-radius:50%;object-fit:cover;background:var(--gl);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:30px;color:var(--gt)}
.prof h1{font-size:44px;margin:18px 0 4px;letter-spacing:-.04em}.prof .meta{color:var(--mut2);margin-bottom:6px}
.prof .price{font-family:var(--ff);font-size:36px;font-weight:700;letter-spacing:-.03em;margin:22px 0 4px}
.facts{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}.fact{background:var(--sf);border:1px solid var(--line);border-radius:16px;padding:10px 14px;font-size:14px}.fact b{display:block;font-size:18px;font-family:var(--ff)}
.samples{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.sample{position:relative;aspect-ratio:9/16;border-radius:26px;overflow:hidden;background:#111;cursor:pointer;box-shadow:var(--sh2);border:1px solid var(--line)}
.sample video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sample .cp{position:absolute;left:0;right:0;bottom:0;padding:40px 14px 14px;background:linear-gradient(transparent,rgba(0,0,0,.8));color:#fff;font-size:15px;line-height:1.35;pointer-events:none}
.sample .pb{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.sample .pb span{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.9);display:flex;align-items:center;justify-content:center;transition:opacity .2s}.sample.playing .pb span{opacity:0}
.wallet{background:linear-gradient(135deg,#0B1F16,#06110C);color:#fff;border-radius:28px;padding:28px;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.wallet:before{content:'';position:absolute;width:300px;height:300px;right:-80px;top:-120px;background:radial-gradient(circle,var(--g),transparent 65%);opacity:.7}
.wallet small{color:#8FA398;position:relative}.wallet .amt{font-family:var(--ff);font-size:46px;font-weight:700;letter-spacing:-.03em;margin:2px 0 14px;color:var(--lime);position:relative}
.wallet>div{position:relative}.wallet b{color:#fff}
.trow{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:15px}.trow:last-child{border:0}.trow small{display:block;color:var(--mut2);font-size:13px}
.plus{color:var(--gt);font-weight:700}.minus{color:var(--redT);font-weight:700}

/* modal + toast */
.modalbg{position:fixed;inset:0;background:rgba(3,10,7,.6);backdrop-filter:blur(6px);z-index:200;display:flex;align-items:center;justify-content:center;padding:20px}
.modal{background:var(--sf);border:1px solid var(--line2);border-radius:28px;padding:28px;max-width:460px;width:100%;max-height:90vh;overflow:auto;color:var(--ink)}
.modal h3{font-size:24px;margin-bottom:10px}.modal .acts{display:flex;gap:10px;justify-content:flex-end;margin-top:20px}
.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:12px 22px;border-radius:999px;font-size:15px;font-weight:500;z-index:300;box-shadow:var(--sh2);animation:rhPop .3s both}
.toast.err2{background:var(--redT);color:#fff}
.spin{width:18px;height:18px;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;display:inline-block}.spin.d{border-color:var(--line2);border-top-color:var(--g)}
@keyframes spin{to{transform:rotate(360deg)}}
.skel{background:linear-gradient(90deg,var(--grey),var(--bg2),var(--grey));background-size:200% 100%;animation:sk 1.2s infinite;border-radius:16px;height:72px;margin-bottom:10px}
@keyframes sk{to{background-position:-200% 0}}
.doc{max-width:760px;margin:0 auto;padding:40px 32px 96px}.doc h1{font-size:48px;margin-bottom:24px}.doc h2{font-size:26px;margin:32px 0 10px}.doc p,.doc li{color:var(--mut);font-size:18px}.doc ul{padding-left:22px}

/* responsive */
@media (max-width:1180px){.grid{grid-template-columns:repeat(3,1fr)}.wsgrid,.wz,.grid2{grid-template-columns:1fr}.sumcard{position:static}.stats,.kpis{grid-template-columns:repeat(2,1fr)}.bento{grid-template-columns:repeat(4,1fr)}.bt.s4{grid-column:span 4}.panel{padding:56px 36px}}
@media (max-width:980px){.steps{grid-template-columns:1fr 1fr}.track{display:none}.grid{grid-template-columns:repeat(2,1fr)}.prof{grid-template-columns:1fr;gap:28px;padding-top:24px}.prof-side{position:static}.playerwrap{flex-direction:column;align-items:center}.phone{width:min(300px,100%)}.cmbox{width:100%}.svcs,.plans{grid-template-columns:1fr}.tsts{columns:2}.leadbox{grid-template-columns:1fr}.navlinks{display:none}.burger{display:inline-flex}.band .rh-wrap{grid-template-columns:1fr 1fr}.sb:nth-child(2){border-right:0}.sb{border-bottom:1px solid var(--line)}.sb:nth-last-child(-n+2){border-bottom:0}}
@media (max-width:860px){
 .side{display:none}.topbar{padding:10px 16px}.topbar .tl{display:flex}.tb-search span,.tb-search kbd{display:none}.tb-search{flex:0 0 auto;max-width:none;width:40px;height:40px;padding:0;justify-content:center}.page{padding:20px 16px 110px}
 .tab-bottom{display:flex;position:fixed;left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));background:var(--glass2);backdrop-filter:blur(20px);border:1px solid var(--line);border-radius:26px;box-shadow:var(--sh2);z-index:60;padding:6px}
 .tab-bottom a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11px;font-weight:600;color:var(--mut2) !important;padding:7px 0;border-radius:20px}
 .tab-bottom a.on{color:var(--gt) !important;background:var(--gl)}.tab-bottom svg{width:22px;height:22px}
 .pagehead h1{font-size:28px}.pmenu{position:fixed;left:12px;right:12px;top:64px;width:auto}
}
@media (max-width:760px){
 .rh-wrap{padding:0 20px}.stage{height:500px}.hero{padding-top:96px}.hero .rh-wrap{padding-top:24px;padding-bottom:40px}.sec{padding:72px 0}.steps{grid-template-columns:1fr}.grid{grid-template-columns:repeat(2,1fr);gap:14px}
 .row2{grid-template-columns:1fr}.samples{grid-template-columns:repeat(2,1fr)}.nav .btn-g,.nav .hide-m{display:none}.stats,.kpis{grid-template-columns:repeat(2,1fr)}.kpi b{font-size:26px}.kpi .spark{display:none}
 .orow{flex-wrap:wrap}.oright{flex-direction:row;align-items:center;width:100%;justify-content:space-between}.cbody{padding:12px}.crow b{font-size:15px}.cfoot b{font-size:16px}.authc{padding:26px 20px}
 .bento{grid-template-columns:1fr 1fr}.bt.s2,.bt.s3,.bt.s4{grid-column:span 2}.bt.r2{grid-row:auto}.tsts{columns:1}.panel{padding:40px 22px;border-radius:30px}.ctabig{padding:56px 24px;border-radius:32px}.leadbox .lb-l,.leadbox .lb-r{padding:28px 22px}.hello{padding:26px 22px}.board{grid-template-columns:repeat(4,230px)}
 .stage{height:440px;overflow:hidden}.stage .reel:last-child{left:4% !important;top:72% !important}.badge-float{padding:8px 12px}.rtile{width:160px}.band .rh-wrap{padding:6px}.sb{padding:16px}
}
@media (max-width:420px){.grid{grid-template-columns:1fr}.cvid{aspect-ratio:9/12}.nav-in{padding-left:12px}.logo b{font-size:19px}.lang button{padding:5px 8px}}
@media (prefers-reduced-motion:reduce){.fl,.in,.pop,.mq-t,.reelrow-t,.reel .prog i,.reel .live i,.mesh i,.hero h1 .w>span,.hl:after,.mini-bars i{animation:none !important}.hl:after{transform:none}.rv{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}
