/* NourSky case study — built by case-studies/phase3/build_assets.py from case-study-template.html. Do not edit by hand. */
/* Token bridge: the template's names, resolved to the site's tokens.css (site values win over the template's fallbacks). */
.ns-cs{
  --ns-p-500:var(--ns-pink,#E91E63); --ns-p-700:#C2185B;
  --ns-muted:var(--ns-tx-2,#4A4468); --ns-white:var(--ns-paper,#FFFFFF);
  --ns-dark-900:var(--ns-ink,#100829); --ns-dark-800:var(--ns-ink-2,#1A0F3D); --ns-dark-700:var(--ns-ink-3,#241653);
  --ns-on-dark:var(--ns-tx-inv,#FFFFFF); --ns-on-dark-muted:var(--ns-tx-inv-2,rgba(255,255,255,.66));
  --ns-steel-100:#ECEBF2; --ns-steel-300:#C9C7D6; --ns-steel-500:#8F8CA6;
  --ns-font:var(--ns-font-body,'Plus Jakarta Sans',system-ui,sans-serif);
  --ns-mono:var(--ns-font-mono,'JetBrains Mono',ui-monospace,monospace);
  --ns-r-md:var(--ns-r,16px);
  --ns-shadow-1:0 1px 2px rgb(16 8 41 / .06),0 4px 14px rgb(16 8 41 / .06);
  --ns-shadow-3:0 30px 60px -20px rgb(16 8 41 / .35),0 12px 24px -12px rgb(16 8 41 / .25);
  --ns-wrap:var(--ns-maxw,1240px);
  font-family:var(--ns-font);color:var(--ns-tx,#160F2E);font-size:16px;line-height:1.6;overflow-x:clip;
}
.ns-cs *,.ns-cs *::before,.ns-cs *::after{box-sizing:border-box}
.ns-cs img{max-width:100%;display:block}
.ns-cs :where(a){color:inherit}
.ns-cs h1,.ns-cs h2,.ns-cs h3,.ns-cs p{margin:0}
.ns-cs .wrap{width:min(var(--ns-wrap),100% - 32px);margin-inline:auto}
.ns-cs :focus-visible{outline:3px solid var(--ns-v-600);outline-offset:3px;border-radius:6px}
.ns-cs .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.ns-cs .eyebrow{font-family:var(--ns-mono);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--ns-p-700);font-weight:500}
.ns-cs:lang(ar) .eyebrow{font-family:var(--ns-font);letter-spacing:0;font-size:14px;font-weight:600}
.ns-cs .h2{font-size:clamp(28px,3.4vw,44px);line-height:1.12;font-weight:600;letter-spacing:-.02em}
.ns-cs:lang(ar) .h2{letter-spacing:0;line-height:1.3}
.ns-cs .h2 em{font-style:normal;color:var(--ns-v-600)}
.ns-cs .lead{color:var(--ns-muted);font-size:17px;max-width:60ch}
.ns-cs .ltr{unicode-bidi:isolate;direction:ltr}
.ns-cs .btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 24px;border-radius:99px; font:600 15px/1 var(--ns-font);text-decoration:none;border:0;cursor:pointer; transition:transform .2s var(--ns-ease),background-color .2s,box-shadow .2s}
.ns-cs .btn svg{width:18px;height:18px;flex:none}
.ns-cs .btn--primary{background:var(--ns-v-600);color:var(--ns-white);box-shadow:0 10px 24px -10px var(--ns-v-600)}
.ns-cs .btn--primary:hover{background:var(--ns-v-700);transform:translateY(-2px)}
.ns-cs .btn--ghost{background:transparent;color:var(--ns-ink);box-shadow:inset 0 0 0 1.5px var(--ns-line)}
.ns-cs .btn--ghost:hover{box-shadow:inset 0 0 0 1.5px var(--ns-v-600);color:var(--ns-v-700)}
.ns-cs .btn--on-dark{background:transparent;color:var(--ns-on-dark);box-shadow:inset 0 0 0 1.5px rgb(255 255 255 / .28)}
.ns-cs .btn--on-dark:hover{box-shadow:inset 0 0 0 1.5px var(--ns-on-dark)}
.ns-cs .btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed;pointer-events:none}
[dir="rtl"] .ns-cs .flip{transform:scaleX(-1)}
.ns-cs-js .ns-cs .rv{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ns-ease),transform .8s var(--ns-ease)}
.ns-cs-js .ns-cs .rv.in{opacity:1;transform:none}
.ns-cs-js .ns-cs .rv[data-d="1"]{transition-delay:.08s}
.ns-cs-js .ns-cs .rv[data-d="2"]{transition-delay:.16s}
.ns-cs-js .ns-cs .rv[data-d="3"]{transition-delay:.24s}
.ns-cs-js .ns-cs .rv[data-d="4"]{transition-delay:.32s}
.ns-cs .hero{position:relative;padding-block:20px 0;overflow:clip; background:radial-gradient(120% 70% at 50% 0%,var(--ns-v-100) 0%,var(--ns-white) 70%)}
.ns-cs .hero__top{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.ns-cs .back{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:99px; font-size:14px;font-weight:500;text-decoration:none;color:var(--ns-ink);background:var(--ns-white);box-shadow:var(--ns-shadow-1)}
.ns-cs .back svg{width:16px;height:16px}
.ns-cs .back:hover{color:var(--ns-v-700)}
.ns-cs .crumbs{font-size:13px;color:var(--ns-muted)}
.ns-cs .stage{--g:clamp(58px,14vw,200px);position:relative;padding-block:calc(var(--g) * .88) clamp(48px,6vw,80px)}
.ns-cs:lang(ar) .stage{--g:clamp(56px,13vw,180px);padding-top:calc(var(--g) * 1.1)}
.ns-cs .giant{position:absolute;inset-inline:0;top:clamp(4px,1vw,14px);text-align:center; font-size:var(--g);line-height:1.05;font-weight:700;letter-spacing:-.04em; color:transparent;background:linear-gradient(180deg,var(--ns-v-300) 10%,transparent 92%);-webkit-background-clip:text;background-clip:text; -webkit-text-stroke:1px var(--ns-v-300);user-select:none;white-space:nowrap;overflow:hidden}
.ns-cs:lang(ar) .giant{letter-spacing:0;line-height:1.3}
.ns-cs .giant b{background:linear-gradient(180deg,color-mix(in srgb,var(--ns-p-500) 45%,var(--ns-v-200)) 10%,transparent 92%);-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:0}
.ns-cs .orb{position:absolute;border-radius:50%;filter:blur(60px);pointer-events:none}
.ns-cs .orb--a{width:420px;height:420px;background:var(--ns-v-300);opacity:.45;top:30%;inset-inline-start:-120px}
.ns-cs .orb--b{width:360px;height:360px;background:var(--ns-p-500);opacity:.14;top:12%;inset-inline-end:-110px}
.ns-cs .laptop{position:relative;width:min(900px,94%);margin-inline:auto;z-index:2}
.ns-cs .laptop__lid{background:var(--ns-dark-900);border-radius:clamp(10px,1.8vw,22px) clamp(10px,1.8vw,22px) 4px 4px; padding:clamp(6px,1.4%,14px) clamp(6px,1.4%,14px) clamp(10px,2.2%,20px);width:86%;margin-inline:auto; box-shadow:var(--ns-shadow-3),inset 0 0 0 1px rgb(255 255 255 / .08);position:relative}
.ns-cs .laptop__lid::before{content:"";position:absolute;top:clamp(2px,.5%,5px);inset-inline:0;margin-inline:auto;width:6px;height:6px;border-radius:50%;background:var(--ns-dark-700)}
.ns-cs .laptop__screen{aspect-ratio:16/10;overflow:hidden;border-radius:4px;background:var(--ns-white);position:relative}
.ns-cs .laptop__base{height:clamp(10px,1.8vw,22px);border-radius:0 0 50% 50% / 0 0 100% 100%;position:relative; background:linear-gradient(var(--ns-steel-100),var(--ns-steel-300) 60%,var(--ns-steel-500))}
.ns-cs .laptop__base::before{content:"";position:absolute;top:0;inset-inline:0;margin-inline:auto;width:14%;height:40%; border-radius:0 0 10px 10px;background:var(--ns-steel-300)}
.ns-cs .plinth{position:absolute;inset-inline:0;margin-inline:auto;bottom:-6%;width:110%;max-width:none;height:70px;z-index:-1; background:radial-gradient(50% 50% at 50% 50%,rgb(26 26 46 / .28),transparent 70%)}
.ns-cs .pan{will-change:transform}
.ns-cs .pan.go{animation:ns-cs-pan var(--pan-dur,22s) ease-in-out 1.6s infinite alternate}
@keyframes ns-cs-pan{to{transform:translateY(calc(var(--pan,0) * -1px))}}
.ns-cs .intro{padding-block:clamp(48px,7vw,96px) clamp(40px,5vw,72px)}
.ns-cs .intro__grid{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(32px,6vw,96px);align-items:end}
.ns-cs .title{font-size:clamp(40px,6vw,80px);line-height:1;font-weight:700;letter-spacing:-.035em;margin-block:14px 18px}
.ns-cs:lang(ar) .title{letter-spacing:0;line-height:1.2}
.ns-cs .title .accent{color:var(--ns-v-600)}
.ns-cs .meta{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--ns-line);border-radius:var(--ns-r-md);overflow:hidden;margin:0}
.ns-cs .meta div{padding:18px 20px;border-bottom:1px solid var(--ns-line);display:flex;gap:12px;align-items:flex-start}
.ns-cs .meta div:nth-child(odd){border-inline-end:1px solid var(--ns-line)}
.ns-cs .meta div:nth-last-child(-n+2){border-bottom:0}
.ns-cs .meta svg{width:20px;height:20px;flex:none;color:var(--ns-v-600);margin-top:3px}
.ns-cs .meta dt{font-size:13px;color:var(--ns-muted)}
.ns-cs .meta dd{margin:2px 0 0;font-weight:600;font-size:15px;line-height:1.4}
.ns-cs .ns-cs-dark{background:var(--ns-dark-900);color:var(--ns-on-dark)}
.ns-cs .devices{position:relative;border-radius:var(--ns-r-xl);overflow:hidden;padding:clamp(40px,6vw,80px) clamp(16px,4vw,56px) 0;isolation:isolate}
.ns-cs .devices__head{text-align:center;max-width:640px;margin-inline:auto}
.ns-cs .devices__head .eyebrow{color:var(--ns-v-300)}
.ns-cs .devices__head p{color:var(--ns-on-dark-muted);margin-top:12px}
.ns-cs .ring{position:absolute;inset-inline:0;margin-inline:auto;top:42%;width:min(760px,120%);aspect-ratio:1;border-radius:50%;z-index:-1; border:1px solid rgb(255 255 255 / .1);box-shadow:0 0 0 70px rgb(255 255 255 / .02),0 0 0 140px rgb(255 255 255 / .015)}
.ns-cs .glow{position:absolute;inset-inline:0;margin-inline:auto;top:46%;width:520px;height:520px;border-radius:50%;z-index:-1; background:var(--ns-v-600);filter:blur(110px);opacity:.42}
.ns-cs .rig{display:flex;justify-content:center;align-items:flex-end;gap:clamp(8px,2.4vw,36px);margin-top:clamp(36px,5vw,64px); padding-bottom:clamp(36px,5vw,64px);position:relative}
.ns-cs .phone{width:clamp(96px,17vw,230px);aspect-ratio:9/19.3;background:var(--ns-dark-800);border-radius:15%/7%;padding:3.2%; box-shadow:0 40px 70px -20px rgb(0 0 0 / .65),inset 0 0 0 1.5px rgb(255 255 255 / .14);position:relative;flex:none}
.ns-cs .phone::after{content:"";position:absolute;top:4.6%;inset-inline:0;margin-inline:auto;width:30%;height:3.2%;border-radius:99px;background:var(--ns-dark-900)}
.ns-cs .phone__screen{width:100%;height:100%;border-radius:12%/5.6%;overflow:hidden;background:var(--ns-white);position:relative}
.ns-cs .phone--c{width:clamp(118px,21vw,280px);z-index:2}
.ns-cs .phone--l{transform:translateY(-6%) rotate(-4deg)}
.ns-cs .phone--r{transform:translateY(-6%) rotate(4deg)}
.ns-cs .tablet{position:absolute;bottom:clamp(36px,5vw,64px);inset-inline-start:2%;width:clamp(200px,30vw,420px);aspect-ratio:4/3; background:var(--ns-dark-800);border-radius:5%;padding:2%;opacity:.55;transform:rotate(-8deg) translateY(-18%); box-shadow:inset 0 0 0 1.5px rgb(255 255 255 / .12)}
.ns-cs .tablet__screen{width:100%;height:100%;overflow:hidden;border-radius:3%;background:var(--ns-white)}
.ns-cs .float{animation:ns-cs-float 7s ease-in-out infinite}
.ns-cs .float--2{animation-delay:-3.5s}
@keyframes ns-cs-float{50%{translate:0 -10px}}
.ns-cs .features{padding-block:clamp(32px,4vw,52px) clamp(56px,8vw,110px);text-align:center}
.ns-cs .features h2{font-size:15px;font-weight:600;color:var(--ns-muted);margin-bottom:18px}
.ns-cs .chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;list-style:none;margin:0;padding:0;max-width:900px;margin-inline:auto}
.ns-cs .chips li{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border-radius:99px;font-size:15px;font-weight:500; background:var(--ns-v-50);box-shadow:inset 0 0 0 1px var(--ns-line);transition:box-shadow .2s,transform .2s var(--ns-ease)}
.ns-cs .chips li:hover{box-shadow:inset 0 0 0 1.5px var(--ns-v-600);transform:translateY(-2px)}
.ns-cs .chips svg{width:16px;height:16px;color:var(--ns-v-600);flex:none}
.ns-cs .iso{position:relative;height:clamp(340px,52vw,700px);overflow:hidden; background:linear-gradient(180deg,var(--ns-v-100),var(--ns-v-50))}
.ns-cs .iso::after{content:"";position:absolute;inset:0;pointer-events:none; background:linear-gradient(90deg,var(--ns-v-50),transparent 14%,transparent 86%,var(--ns-v-50)), linear-gradient(180deg,var(--ns-v-100),transparent 16%,transparent 84%,var(--ns-v-50))}
.ns-cs .iso__plane{position:absolute;left:50%;top:50%;width:max(1500px,150%);display:grid;grid-template-columns:repeat(4,1fr);gap:40px; transform:translate(-50%,-50%) rotateX(54deg) rotateZ(-36deg)}
.ns-cs .iso__col{display:flex;flex-direction:column;gap:40px}
.ns-cs .iso__col:nth-child(even){margin-top:160px}
.ns-cs .iso.go .iso__col:nth-child(odd){animation:ns-cs-drift 26s linear infinite alternate}
.ns-cs .iso.go .iso__col:nth-child(even){animation:ns-cs-drift 26s linear infinite alternate-reverse}
@keyframes ns-cs-drift{to{transform:translateY(-220px)}}
.ns-cs .tile{aspect-ratio:16/10;border-radius:14px;overflow:hidden;background:var(--ns-white); box-shadow:-24px 30px 40px -14px rgb(26 26 46 / .28),0 0 0 1px rgb(26 26 46 / .05)}
.ns-cs .cs{padding-block:clamp(64px,9vw,128px)}
.ns-cs .cs__head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(32px,4vw,52px)}
.ns-cs .cs__grid{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(16px,2.4vw,28px);align-items:stretch}
.ns-cs .card{border-radius:var(--ns-r-lg);padding:clamp(24px,3vw,40px);background:var(--ns-white);box-shadow:inset 0 0 0 1px var(--ns-line)}
.ns-cs .card--sol{background:var(--ns-v-50);box-shadow:inset 0 0 0 1.5px var(--ns-v-300)}
.ns-cs .card__badge{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:22px;margin-bottom:12px}
.ns-cs .card__badge i{display:grid;place-items:center;width:44px;height:44px;border-radius:12px}
.ns-cs .card__badge svg{width:22px;height:22px}
.ns-cs .card--ch .card__badge i{background:color-mix(in srgb,var(--ns-warn) 14%,var(--ns-white));color:var(--ns-warn)}
.ns-cs .card--sol .card__badge i{background:color-mix(in srgb,var(--ns-ok) 14%,var(--ns-white));color:var(--ns-ok)}
.ns-cs .card p{color:var(--ns-muted)}
.ns-cs .list{list-style:none;margin:24px 0 0;padding:0;counter-reset:n}
.ns-cs .list li{counter-increment:n;display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:center;padding-block:12px;border-top:1px solid var(--ns-line);font-weight:500}
.ns-cs .list li::before{content:counter(n,decimal-leading-zero);font-family:var(--ns-mono);font-size:13px;color:var(--ns-muted)}
.ns-cs .card--sol .list li::before{color:var(--ns-v-700)}
.ns-cs .bridge{display:grid;place-items:center}
.ns-cs .bridge span{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--ns-v-600);color:var(--ns-white);box-shadow:0 12px 24px -10px var(--ns-v-600)}
.ns-cs .bridge svg{width:22px;height:22px}
.ns-cs .cta{position:relative;border-radius:var(--ns-r-xl);padding:clamp(48px,7vw,96px) clamp(20px,5vw,72px);overflow:hidden;text-align:center;isolation:isolate}
.ns-cs .cta::before{content:"";position:absolute;inset:0;z-index:-1; background:radial-gradient(60% 80% at 50% 120%,var(--ns-dark-700),transparent 70%), repeating-linear-gradient(90deg,rgb(255 255 255 / .035) 0 1px,transparent 1px 64px), repeating-linear-gradient(0deg,rgb(255 255 255 / .035) 0 1px,transparent 1px 64px)}
.ns-cs .cta .orb{width:380px;height:380px;background:var(--ns-v-600);opacity:.5;filter:blur(90px);top:-160px;inset-inline-end:-80px}
.ns-cs .cta .eyebrow{color:var(--ns-v-300)}
.ns-cs .cta h2{font-size:clamp(30px,4.6vw,60px);line-height:1.08;font-weight:600;letter-spacing:-.03em;max-width:16ch;margin:16px auto 18px}
.ns-cs:lang(ar) .cta h2{letter-spacing:0;line-height:1.3}
.ns-cs .cta h2 em{font-style:normal;color:var(--ns-v-300)}
.ns-cs .cta p{color:var(--ns-on-dark-muted);max-width:52ch;margin-inline:auto}
.ns-cs .cta__btns{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:32px}
.ns-cs .screens{padding-block:clamp(64px,9vw,128px) clamp(56px,8vw,110px)}
.ns-cs .screens__head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.ns-cs .screens__note{font-size:14px;color:var(--ns-muted);margin-top:10px}
.ns-cs .ctrl{position:sticky;top:12px;z-index:10;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap; margin-block:28px 24px;padding:8px;border-radius:99px;background:rgb(255 255 255 / .86);backdrop-filter:blur(12px); box-shadow:var(--ns-shadow-1),inset 0 0 0 1px var(--ns-line)}
.ns-cs .tabs{display:flex;gap:4px;flex-wrap:wrap}
.ns-cs .tab{min-height:44px;padding:0 18px;border-radius:99px;border:0;background:transparent;font:500 14px var(--ns-font);color:var(--ns-muted);cursor:pointer;transition:background-color .2s,color .2s}
.ns-cs .tab:hover{color:var(--ns-ink)}
.ns-cs .tab[aria-selected="true"]{background:var(--ns-dark-900);color:var(--ns-white)}
.ns-cs .nav{display:flex;align-items:center;gap:8px}
.ns-cs .count{font-family:var(--ns-mono);font-size:13px;color:var(--ns-muted);min-width:64px;text-align:center}
.ns-cs .arrow{width:44px;height:44px;border-radius:50%;border:0;display:grid;place-items:center;background:var(--ns-v-600);color:var(--ns-white);cursor:pointer;transition:background-color .2s,transform .2s var(--ns-ease)}
.ns-cs .arrow:hover{background:var(--ns-v-700)}
.ns-cs .arrow:active{transform:scale(.94)}
.ns-cs .arrow svg{width:18px;height:18px}
.ns-cs .viewport{position:relative;overflow:hidden;touch-action:pan-y;transition:height .55s var(--ns-ease); -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.ns-cs .track{display:flex;align-items:flex-start;gap:clamp(16px,3vw,40px);transition:transform .6s var(--ns-ease)}
.ns-cs .slide{flex:none;width:min(600px,84vw);transition:opacity .5s,transform .6s var(--ns-ease);opacity:.35;transform:scale(.9);transform-origin:top center;cursor:pointer}
.ns-cs .slide.on{opacity:1;transform:none;cursor:default}
.ns-cs .browser{border-radius:16px;overflow:hidden;background:var(--ns-white);box-shadow:var(--ns-shadow-3),0 0 0 1px var(--ns-line)}
.ns-cs .browser__bar{display:flex;align-items:center;gap:6px;padding:10px 14px;background:var(--ns-steel-100);border-bottom:1px solid var(--ns-line)}
.ns-cs .browser__bar i{width:10px;height:10px;border-radius:50%;background:var(--ns-steel-300)}
.ns-cs .browser__bar span{flex:1;margin-inline-start:10px;height:22px;border-radius:99px;background:var(--ns-white);font:500 11px/22px var(--ns-mono);color:var(--ns-muted);padding-inline:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;direction:ltr;text-align:start}
.ns-cs .next{border-top:1px solid var(--ns-line);padding-block:28px 44px}
.ns-cs .next .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.ns-cs .next a.big{display:inline-flex;align-items:center;gap:12px;font-size:clamp(20px,2.4vw,28px);font-weight:600;text-decoration:none;min-height:44px}
.ns-cs .next a.big:hover{color:var(--ns-v-700)}
.ns-cs .next a.big svg{width:24px;height:24px}
.ns-cs .scr--m{--u:2.6cqw}
.ns-cs .scr-nav{display:flex;align-items:center;gap:calc(var(--u)*2.4);height:calc(var(--u)*6.5);background:var(--ns-white);box-shadow:0 1px 0 color-mix(in srgb,var(--ns-ink) 8%,transparent)}
.ns-cs .scr-nav .lg{width:calc(var(--u)*2.6);height:calc(var(--u)*2.6);border-radius:30%;background:var(--proj);flex:none}
.ns-cs .scr-nav .lgt{width:calc(var(--u)*8);height:calc(var(--u)*1.2);border-radius:99px;background:color-mix(in srgb,var(--ns-ink) 70%,transparent);margin-inline-end:auto}
.ns-cs .scr-nav .lk{width:calc(var(--u)*5);height:calc(var(--u)*.8);border-radius:99px;background:color-mix(in srgb,var(--ns-ink) 22%,transparent)}
.ns-cs .scr-nav .pill{margin:0;width:calc(var(--u)*9);height:calc(var(--u)*2.8)}
.ns-cs .scr--m .scr-nav .lk,.ns-cs .scr--m .scr-nav .pill{display:none}
.ns-cs .scr--m .scr-nav .bg{display:block}
.ns-cs .scr-nav .bg{display:none;width:calc(var(--u)*3);height:calc(var(--u)*2);background:linear-gradient(var(--ns-ink) 0 20%,transparent 0 40%,var(--ns-ink) 0 60%,transparent 0 80%,var(--ns-ink) 0)}
.ns-cs .scr-hero{display:grid;grid-template-columns:1fr 1.05fr;gap:calc(var(--u)*4);align-items:center;padding-block:calc(var(--u)*7)}
.ns-cs .scr-hero .im{min-height:calc(var(--u)*26)}
.ns-cs .scr--m .scr-hero{grid-template-columns:1fr;padding-block:calc(var(--u)*5)}
.ns-cs .scr--m .scr-hero .im{order:-1;min-height:calc(var(--u)*34)}
.ns-cs .scr-sec{padding-block:calc(var(--u)*5)}
.ns-cs .scr-sec>.b.h{margin-bottom:calc(var(--u)*3)}
.ns-cs .scr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:calc(var(--u)*2.4)}
.ns-cs .scr-grid.g4{grid-template-columns:repeat(4,1fr)}
.ns-cs .scr--m .scr-grid{grid-template-columns:1fr}
.ns-cs .scr--m .scr-grid.g4{grid-template-columns:1fr 1fr}
.ns-cs .scr--m .card-s .im{min-height:calc(var(--u)*24)}
.ns-cs .scr-band{margin-block:calc(var(--u)*4);margin-inline:calc(var(--u)*4);padding:calc(var(--u)*4);border-radius:calc(var(--u)*1.6); background:var(--proj);display:grid;grid-template-columns:1.2fr 1fr;gap:calc(var(--u)*3);align-items:center}
.ns-cs .scr-band .b{background:rgb(255 255 255 / .35)}
.ns-cs .scr-band .b.h{background:rgb(255 255 255 / .92)}
.ns-cs .scr-band .pill{background:var(--ns-white)}
.ns-cs .scr--m .scr-band{grid-template-columns:1fr}
.ns-cs .scr-split{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*4);align-items:center;padding-block:calc(var(--u)*5)}
.ns-cs .scr-split .im{min-height:calc(var(--u)*22)}
.ns-cs .scr--m .scr-split{grid-template-columns:1fr}
.ns-cs .scr-split .row{display:flex;gap:calc(var(--u)*1.2);align-items:center;margin-top:calc(var(--u)*1.2)}
.ns-cs .scr-split .row i{width:calc(var(--u)*1.8);height:calc(var(--u)*1.8);border-radius:50%;background:var(--proj);flex:none}
.ns-cs .scr-split .row .b{flex:1;margin:0}
.ns-cs .scr-filters{display:flex;gap:calc(var(--u)*1.2);padding-block:calc(var(--u)*2);flex-wrap:wrap}
.ns-cs .scr-filters span{height:calc(var(--u)*3);width:calc(var(--u)*10);border-radius:99px;background:var(--ns-white);box-shadow:inset 0 0 0 calc(var(--u)*.15) color-mix(in srgb,var(--ns-ink) 15%,transparent)}
.ns-cs .scr-filters span:first-child{background:var(--proj);box-shadow:none}
.ns-cs .scr-pagehead{padding-block:calc(var(--u)*6) calc(var(--u)*3);background:color-mix(in srgb,var(--proj) 10%,var(--ns-white))}
.ns-cs .scr-gallery{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:calc(var(--u)*1.4);padding-block:calc(var(--u)*3)}
.ns-cs .scr-gallery .im:first-child{grid-row:span 2;min-height:calc(var(--u)*30)}
.ns-cs .scr-gallery .im{min-height:0}
.ns-cs .scr--m .scr-gallery{grid-template-columns:1fr 1fr;grid-template-rows:auto}
.ns-cs .scr--m .scr-gallery .im:first-child{grid-column:span 2;grid-row:auto;min-height:calc(var(--u)*34)}
.ns-cs .scr--m .scr-gallery .im{min-height:calc(var(--u)*14)}
.ns-cs .scr-form{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*1.4);margin-top:calc(var(--u)*2)}
.ns-cs .scr-form span{height:calc(var(--u)*3.6);border-radius:calc(var(--u)*.8);background:var(--ns-white);box-shadow:inset 0 0 0 calc(var(--u)*.15) color-mix(in srgb,var(--ns-ink) 15%,transparent)}
.ns-cs .scr--m .scr-form{grid-template-columns:1fr}
.ns-cs .scr-foot{background:var(--ns-dark-900);padding-block:calc(var(--u)*5);display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:calc(var(--u)*3);margin-top:calc(var(--u)*4)}
.ns-cs .scr-foot .b{background:rgb(255 255 255 / .2)}
.ns-cs .scr-foot .b.s{background:rgb(255 255 255 / .7)}
.ns-cs .scr-foot .lg{width:calc(var(--u)*3);height:calc(var(--u)*3);border-radius:30%;background:var(--proj)}
.ns-cs .scr--m .scr-foot{grid-template-columns:1fr 1fr}
@media (max-width:900px){.ns-cs .intro__grid{grid-template-columns:1fr}
.ns-cs .cs__grid{grid-template-columns:1fr}
.ns-cs .bridge span{transform:rotate(90deg)}
[dir="rtl"] .ns-cs .bridge span{transform:rotate(90deg)}
.ns-cs .tablet{display:none}}
@media (max-width:560px){.ns-cs .meta{grid-template-columns:1fr}
.ns-cs .meta div:nth-child(odd){border-inline-end:0}
.ns-cs .meta div:nth-last-child(2){border-bottom:1px solid var(--ns-line)}
.ns-cs .ctrl{border-radius:22px}
.ns-cs .tabs{width:100%;justify-content:center}
.ns-cs .nav{width:100%;justify-content:center}
.ns-cs .crumbs{display:none}
.ns-cs .stage{padding-top:calc(var(--g) * 1.2)}
.ns-cs:lang(ar) .stage{padding-top:calc(var(--g) * 1.35)}}
[dir="rtl"] .ns-cs .phone--l{transform:translateY(-6%) rotate(4deg)}
[dir="rtl"] .ns-cs .phone--r{transform:translateY(-6%) rotate(-4deg)}
[dir="rtl"] .ns-cs .tablet{transform:rotate(8deg) translateY(-18%)}
[dir="rtl"] .ns-cs .iso__plane{transform:translate(-50%,-50%) rotateX(54deg) rotateZ(36deg)}
[dir="rtl"] .ns-cs .tile{box-shadow:24px 30px 40px -14px rgb(26 26 46 / .28),0 0 0 1px rgb(26 26 46 / .05)}
[dir="rtl"] .ns-cs .count{unicode-bidi:isolate;direction:ltr}
@media (prefers-reduced-motion:reduce){.ns-cs *,.ns-cs *::before,.ns-cs *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.ns-cs-js .ns-cs .rv{opacity:1;transform:none}}
/* ── Site integration (not in the template) ── */
.ns-cs .title,.ns-cs .h2,.ns-cs .giant,.ns-cs .cta h2,.ns-cs .card__badge,.ns-cs .next a.big{font-family:var(--ns-font-display,var(--ns-font))}
.ns-cs .title,.ns-cs .h2,.ns-cs .card__badge{color:var(--ns-ink,#100829)}
.ns-cs .ns-cs-dark .h2,.ns-cs .cta h2{color:var(--ns-on-dark)}
.ns-cs .next a.big,.ns-cs .next a.big:visited{color:var(--ns-ink,#100829)}
.ns-cs a.btn--primary,.ns-cs a.btn--primary:hover{color:var(--ns-white)}
.ns-cs a.btn--on-dark,.ns-cs a.btn--on-dark:hover{color:var(--ns-on-dark)}
.ns-cs .shot{width:100%;height:auto;display:block;max-width:none}
.ns-cs .meta--odd div:last-child{grid-column:1 / -1;border-inline-end:0}
.ns-cs .meta--odd div:nth-last-child(2){border-bottom:1px solid var(--ns-line)}
/* the theme zeroes figure margins with a heavier selector: without this the laptop hugs the inline start */
.ns-cs figure.laptop{margin:0 auto!important}
.ns-cs .laptop__screen:empty,.ns-cs .phone__screen:empty,.ns-cs .tablet__screen:empty{background:linear-gradient(160deg,var(--ns-v-100),var(--ns-v-50))}
.ns-cs button.tab,.ns-cs button.arrow{box-shadow:none;text-transform:none;letter-spacing:0;line-height:1.2}
.ns-cs button.arrow{padding:0}
/* the site header is fixed and 72px tall */
.ns-cs .ctrl{top:var(--ns-cs-sticky-top,84px)}
.ns-cs .list,.ns-cs .chips{padding-inline-start:0}
.ns-cs .meta dt,.ns-cs .meta dd{margin-inline-start:0}
.ns-cs .rig>div{flex:none}
/* devices section 1.8: the owner's device mockups, each real capture laid into its screen in perspective; every screen scrolls */
.ns-cs .rig--mock{display:block;position:relative;width:100%;aspect-ratio:16/8.6;margin-top:clamp(28px,4vw,56px);padding-bottom:0;margin-bottom:clamp(30px,4.5vw,60px)}
.ns-cs .rig--mock::before{content:"";position:absolute;left:-6%;right:-6%;bottom:-4%;height:26%;z-index:0;background:radial-gradient(60% 100% at 50% 100%,color-mix(in srgb,var(--ns-v-600) 55%,transparent),transparent 70%);pointer-events:none}
.ns-cs .rig--mock::after{content:"";position:absolute;left:-4%;right:-4%;bottom:3.5%;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--ns-v-600) 20%,var(--ns-v-300) 50%,var(--ns-v-600) 80%,transparent);box-shadow:0 0 46px 10px color-mix(in srgb,var(--ns-v-600) 70%,transparent);opacity:.6;z-index:0}
.ns-cs .mk{position:absolute;aspect-ratio:var(--mk-w)/var(--mk-h);filter:drop-shadow(0 30px 34px rgb(0 0 0 / .55))}
.ns-cs .mk__stage{position:absolute;left:0;top:0;width:calc(var(--mk-w) * 1px);height:calc(var(--mk-h) * 1px);transform-origin:0 0;transform:scale(var(--mk-s,.3))}
.ns-cs .mk__screen{position:absolute;left:0;top:0;transform-origin:0 0;background:var(--ns-white);opacity:0;transition:opacity .4s}
.ns-cs .mk.is-on .mk__screen{opacity:1}
.ns-cs .mk__frame{position:absolute;inset:0;width:100%;height:100%;max-width:none;pointer-events:none;user-select:none}
/* 1.9: the frontal phone stands in the middle, in front of the monitor; the tablet is larger, on the left */
.ns-cs .mk--monitor{left:25%;top:0;width:50%;z-index:1}
.ns-cs .mk--laptop{right:-1.5%;bottom:1%;width:40%;z-index:3}
.ns-cs .mk--tablet{left:1%;bottom:3%;width:36%;z-index:2}
.ns-cs .mk--phone{left:41.25%;bottom:0;width:17.5%;z-index:5}
.ns-cs [data-scroll]{overflow-y:auto;scrollbar-width:none;-ms-overflow-style:none}
.ns-cs [data-scroll]::-webkit-scrollbar{display:none}
@media (hover:none){.ns-cs [data-scroll]{overflow:hidden}}
@media (max-width:700px){.ns-cs .rig--mock{aspect-ratio:1/1.3}.ns-cs .mk--monitor{left:3%;top:0;width:94%}.ns-cs .mk--laptop{display:none}.ns-cs .mk--tablet{left:-2%;right:auto;bottom:6%;width:58%}.ns-cs .mk--phone{left:auto;right:6%;bottom:0;width:38%}}
/* the single template's shortcode widgets add no spacing of their own */
.elementor-widget-shortcode:has(> .elementor-widget-container > .elementor-shortcode > .ns-cs),.elementor-widget-shortcode:has(> .elementor-shortcode > .ns-cs){width:100%}