:root{--navy:#102544;--deep:#0b1930;--blue:#296fe8;--cyan:#3bcbd0;--ink:#162b42;--muted:#627588;--line:#dce6ee;--pale:#f3f7fa}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:88px}body{margin:0;color:var(--ink);background:#fff;font:400 16px/1.85 NotoArabic,Arial,sans-serif}a{text-decoration:none;color:inherit}button{font:inherit}img{max-width:100%}h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.4;font-weight:700}h2{font-size:clamp(2rem,3.5vw,3.4rem);letter-spacing:-.025em}h3{font-size:1.5rem}p{line-height:1.95}.container{width:min(1180px,calc(100% - 48px));margin-inline:auto}.section{padding:110px 0}.skip-link{position:absolute;top:-100px;right:20px;z-index:20;background:white;padding:10px 18px}.skip-link:focus{top:10px}a:focus-visible,button:focus-visible{outline:3px solid var(--cyan);outline-offset:4px}.eyebrow{font-size:.86rem;font-weight:700;color:#2369ca;letter-spacing:.02em;margin:0 0 20px}.eyebrow.light{color:#7ce1e5}.eyebrow span{display:inline-block;width:18px;height:1px;background:currentColor;margin:0 8px 4px}.button{display:inline-flex;align-items:center;justify-content:center;gap:20px;border-radius:12px;padding:15px 24px;min-height:53px;font-weight:700;line-height:1.4;transition:transform .2s,background .2s,box-shadow .2s}.button:hover{transform:translateY(-2px)}.button span{font-size:1.2rem}.button-light{background:#fff;color:var(--navy);box-shadow:0 10px 30px #06162d24}.button-outline{color:#fff;border:1px solid #7894b2;background:#ffffff0d}.button-outline:hover{background:#ffffff20}.button-primary{color:#fff;background:var(--blue);box-shadow:0 12px 25px #286ee833}.button-primary:hover{background:#175bd2}.plain-link{font-weight:700;color:#215ec0;display:inline-flex;gap:8px;align-items:center}.plain-link:hover{text-decoration:underline}
.site-header{background:#fff;position:sticky;top:0;z-index:10;border-bottom:1px solid #eaf0f4;box-shadow:0 6px 20px #0c1e3508}.header-inner{height:86px;display:flex;align-items:center;justify-content:space-between;gap:32px}.brand{display:flex;align-items:center;flex:none}.brand img{width:222px;height:auto;display:block}.nav{display:flex;align-items:center;gap:30px;font-weight:700;font-size:.9rem}.nav a:not(.nav-contact):hover{color:var(--blue)}.nav-contact{background:var(--navy);color:#fff;border-radius:9px;padding:10px 18px}.nav-contact:hover{background:var(--blue)}.menu-toggle{display:none}
.hero{background:radial-gradient(circle at 19% 30%,#1e4574 0%,transparent 42%),linear-gradient(125deg,#102747,#0b1930 70%);color:#fff;position:relative;overflow:hidden}.hero-glow{position:absolute;width:420px;height:420px;border:1px solid #4ea2c32d;border-radius:50%;left:-200px;bottom:-220px;pointer-events:none}.hero-grid{min-height:655px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:58px;padding-block:83px}.hero h1{font-size:clamp(2.7rem,5vw,4.5rem);letter-spacing:-.035em;margin-bottom:22px}.hero h1 em{font-style:normal;color:#67d8df}.hero-lead{font-size:1.15rem;color:#d1dfeb;max-width:640px;margin-bottom:32px}.hero-actions{display:flex;gap:14px;flex-wrap:wrap}.hero-note{margin-top:45px;color:#a8c3d4;font-size:.88rem;display:flex;align-items:center;gap:10px}.mini-line{width:29px;height:2px;background:var(--cyan)}.hero-visual{height:460px;position:relative;direction:ltr}.visual-back,.visual-front{position:absolute;border-radius:27px;box-shadow:0 25px 65px #0005;direction:rtl}.visual-back{width:330px;height:340px;right:8px;top:5px;background:#f8fbfd;color:var(--ink);padding:35px;transform:rotate(5deg)}.visual-back>span{color:#2c75cf;font-size:.78rem;font-weight:700}.visual-back strong{display:block;margin-top:37px;font-size:2rem;line-height:1.5}.visual-pills{display:flex;flex-wrap:wrap;gap:7px;margin-top:27px}.visual-pills i{font-style:normal;border-radius:20px;background:#eaf2f8;padding:3px 11px;font-size:.73rem;color:#49657d}.visual-front{width:340px;height:355px;left:8px;bottom:2px;background:linear-gradient(160deg,#286de5,#174baf);color:#fff;padding:33px;transform:rotate(-6deg)}.visual-front-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #ffffff44;padding-bottom:16px}.visual-front-top b{font-size:1.35rem}.visual-front-top small{color:#d2e6ff}.visual-front>strong{display:block;font-size:1.8rem;line-height:1.55;margin-top:25px}.visual-bars{height:76px;display:flex;align-items:end;gap:12px;margin-top:17px}.visual-bars i{width:28px;border-radius:8px 8px 0 0;background:#97ddff;opacity:.85;height:30%}.visual-bars i:nth-child(2){height:53%}.visual-bars i:nth-child(3){height:71%;background:#50d5d7}.visual-bars i:nth-child(4){height:92%}.visual-front-bottom{font-size:.78rem;color:#d7e9ff}.visual-orbit{position:absolute;left:155px;top:-23px;width:55px;height:55px;border-radius:50%;background:#39ccd3;box-shadow:0 0 0 12px #39ccd331}
.section-heading{margin-bottom:38px}.split-heading{display:grid;grid-template-columns:1.2fr .8fr;gap:70px;align-items:end}.split-heading h2{max-width:720px;margin:0}.split-heading p,.work-heading p{color:var(--muted);font-size:1.05rem;margin:0}.solution-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.solution-card{position:relative;border:1px solid var(--line);border-radius:22px;padding:33px 36px 31px;min-height:295px;transition:transform .2s,box-shadow .2s,border-color .2s;background:#fff}.solution-card:hover{transform:translateY(-5px);box-shadow:0 18px 50px #14365314;border-color:#b6d5e9}.solution-index{position:absolute;left:32px;top:30px;color:#a0b4c5;font-weight:700}.solution-icon{display:grid;place-items:center;width:54px;height:54px;border-radius:14px;background:#e9f3fc;color:#2570d9;font:700 1.9rem Arial,sans-serif;margin-bottom:17px}.rafed-icon{background:#e8f9f9;color:#009ba6}.solution-card h3{margin:0 0 8px}.solution-card p{color:#576d80;margin-bottom:24px;max-width:450px}.text-link{font-weight:700;color:#1e65c4}.text-link b{font-size:1.25rem;margin-right:7px}
.websites{background:#f2f7fb}.websites-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:78px;align-items:center}.websites-copy h2{max-width:680px;margin-bottom:19px}.section-lead{font-size:1.1rem;color:#52697e;margin-bottom:30px}.steps{border-top:1px solid #cbdbe6;margin-bottom:33px}.steps>div{display:flex;gap:19px;padding:16px 0;border-bottom:1px solid #cbdbe6}.steps span{color:#2e78d3;font:700 1.05rem Arial,sans-serif;padding-top:7px}.steps p{margin:0}.steps strong,.steps small{display:block}.steps strong{font-size:1rem}.steps small{color:#6d8090;font-size:.86rem;line-height:1.8}.inline-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.websites-preview{border:1px solid #d7e4ed;box-shadow:0 28px 70px #1c456321;border-radius:22px;overflow:hidden;background:#fff;transform:rotate(-2deg);max-width:440px;margin:auto}.mock-browser{height:43px;background:#e6eff5;display:flex;align-items:center;gap:5px;padding:0 16px;direction:ltr}.mock-browser span{width:7px;height:7px;border-radius:50%;background:#a6bdcc}.mock-browser small{margin:auto;background:#fff;border-radius:10px;padding:2px 33px;color:#8ba0af;font-size:.65rem}.mock-site{padding:29px 28px 30px;min-height:455px}.mock-top{display:flex;justify-content:space-between;color:#254766;font-size:.8rem}.mock-top i{font-style:normal;font-weight:700}.mock-top b{font-size:.7rem}.mock-kicker{margin:42px 0 0;color:#2294a6;font-size:.75rem}.mock-site h3{margin:5px 0 25px;font-size:1.58rem}.mock-service{display:flex;align-items:center;gap:15px;padding:13px 15px;background:#f4f8fa;border:1px solid #e5edf2;border-radius:12px;margin:10px 0}.mock-service-icon{display:grid;place-items:center;width:39px;height:39px;border-radius:9px;color:#1d72d4;background:#e0efff;flex:none}.mock-service p{margin:0;flex:1}.mock-service strong,.mock-service small{display:block;line-height:1.5}.mock-service strong{font-size:.83rem}.mock-service small{color:#728b9e;font-size:.66rem}.mock-service>span:last-child{color:#2d71b9}.mock-request{background:#177268;color:#fff;border-radius:10px;text-align:center;font-size:.88rem;font-weight:700;padding:10px 15px;margin-top:23px}
.rafed{background:var(--deep);color:#fff}.rafed-heading{display:flex;align-items:end;justify-content:space-between;gap:60px;margin-bottom:42px}.rafed-heading h2{margin:0}.rafed-heading>p{max-width:380px;color:#c7d6e5;font-size:1.02rem;margin:0}.rafed-showcase{display:grid;grid-template-columns:1fr .85fr;gap:50px;align-items:center;background:#142948;border:1px solid #ffffff14;border-radius:28px;padding:38px 55px}.rafed-tabs{display:flex;flex-direction:column;gap:10px}.rafed-tab{background:transparent;text-align:right;border:1px solid transparent;color:#b9cbdc;border-radius:14px;padding:18px 20px;cursor:pointer;transition:.2s}.rafed-tab:hover{background:#ffffff0b}.rafed-tab.active{background:#1f3d65;border-color:#4e7aaf;color:#fff}.rafed-tab span{float:left;color:#69d9e2;font:700 .9rem Arial,sans-serif;padding-top:9px}.rafed-tab strong,.rafed-tab small{display:block;max-width:390px}.rafed-tab strong{font-size:1.1rem}.rafed-tab small{font-size:.83rem;color:#a9bfd1;line-height:1.8;margin-top:3px}.rafed-screen{text-align:center}.screen-frame{width:min(300px,100%);height:465px;margin:auto;background:#f9fbff;border:9px solid #304d70;border-radius:26px;overflow:hidden;box-shadow:0 25px 45px #0005}.screen-top{height:30px;background:#f3f6f8;display:flex;align-items:center;gap:4px;padding:0 12px;direction:ltr}.screen-top span{width:5px;height:5px;border-radius:50%;background:#b7c8d5}.screen-top b{font:400 10px Arial,sans-serif;color:#7e93a1;margin:auto}.screen-viewport{height:calc(100% - 30px);overflow:hidden;position:relative}.screen-viewport img{width:100%;max-width:none;height:auto;display:block;margin-top:var(--image-offset,-78px)}.rafed-screen p{color:#9db4c8;font-size:.8rem;margin:12px 0 0}.rafed-actions{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:33px}.rafed-actions strong,.rafed-actions span{display:block}.rafed-actions strong{font-size:1.22rem}.rafed-actions div>span{color:#a9bdce;font-size:.88rem;margin-top:3px}
.work-heading{display:flex;justify-content:space-between;align-items:end;gap:50px}.work-heading h2{margin:0}.work-heading p{max-width:440px}.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.work-card{border:1px solid var(--line);border-radius:20px;overflow:hidden;transition:transform .2s,box-shadow .2s}.work-card:hover{transform:translateY(-4px);box-shadow:0 15px 30px #183c561b}.work-art{height:230px;position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;overflow:hidden}.work-art:after{content:"";position:absolute;width:230px;height:230px;border:1px solid #ffffff44;border-radius:50%;right:-100px;bottom:-130px}.art-tag{position:absolute;right:16px;top:16px;border:1px solid #ffffff77;background:#ffffff1a;color:#fff;border-radius:30px;font-size:.69rem;padding:3px 10px}.work-art strong{font:700 3.2rem Arial,sans-serif;line-height:1.1;z-index:1}.work-art small{font:700 .75rem Arial,sans-serif;letter-spacing:.22em;z-index:1;margin-top:7px}.work-h2o .work-art{background:linear-gradient(135deg,#0c617e,#06394e);color:#fff}.work-h2o .work-art strong span{font-size:2.1rem}.work-info{display:flex;align-items:center;justify-content:space-between;padding:18px 20px}.work-info strong,.work-info small{display:block}.work-info strong{font-size:1rem}.work-info small{font-size:.79rem;color:#74899a}.work-info b{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#eaf3fa;color:#246bc6;font:700 1.3rem Arial}
.about{background:#f3f7fa}.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:100px;align-items:center}.about h2{margin:0}.about p{font-size:1.1rem;color:#4e6579;margin-bottom:17px}.about .eyebrow{font-size:.86rem;color:#2369ca;margin-bottom:20px}
.contact{padding-block:75px}.contact-box{background:linear-gradient(110deg,#1c5188,#0e2546 75%);border-radius:27px;padding:58px 65px;color:#fff;display:flex;justify-content:space-between;align-items:center;gap:50px;box-shadow:0 22px 50px #0d345235}.contact h2{margin:0 0 11px}.contact p:not(.eyebrow){margin:0;color:#d7e7f2;max-width:720px}.contact .button{white-space:nowrap}.footer{border-top:1px solid #e0e9ee}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;padding-block:25px}.footer img{width:185px}.footer p{font-size:.78rem;color:#738799;margin:0}.footer a{font:700 .86rem Arial,sans-serif;color:#256bc7}
@media(max-width:1000px){.nav{gap:14px;font-size:.8rem}.brand img{width:175px}.hero-grid,.websites-grid{gap:35px}.hero-visual{transform:scale(.82);transform-origin:center}.visual-back{right:-25px}.visual-front{left:-25px}.rafed-showcase{padding:35px}.work-art{height:190px}}
@media(max-width:760px){html{scroll-padding-top:70px}.container{width:min(100% - 36px,600px)}.section{padding:74px 0}.header-inner{height:70px}.brand img{width:170px}.menu-toggle{display:flex;flex-direction:column;gap:5px;background:none;border:0;padding:12px;cursor:pointer}.menu-toggle span{height:2px;width:23px;background:var(--navy);border-radius:2px}.nav{display:none;position:absolute;top:70px;right:0;left:0;background:#fff;box-shadow:0 18px 25px #10254420;padding:18px 25px 24px;flex-direction:column;align-items:stretch;gap:4px;font-size:1rem}.nav.open{display:flex}.nav a{padding:9px 0}.nav-contact{text-align:center;padding:12px!important;margin-top:8px}.hero-grid{display:flex;flex-direction:column;align-items:stretch;gap:26px;min-height:0;padding-block:65px 45px}.hero h1{font-size:clamp(2.5rem,9vw,3.6rem)}.hero-lead{font-size:1rem}.hero-note{margin-top:26px}.hero-visual{height:340px;transform:scale(.7);transform-origin:center top;width:470px;max-width:100%;align-self:center;margin-bottom:-95px}.visual-back{right:0}.visual-front{left:0}.split-heading,.websites-grid,.about-grid{grid-template-columns:1fr;gap:23px}.section-heading{margin-bottom:26px}.solution-grid{grid-template-columns:1fr}.solution-card{min-height:0;padding:27px}.websites-grid{gap:52px}.websites-preview{width:100%;max-width:430px}.rafed-heading{display:block;margin-bottom:30px}.rafed-heading h2{font-size:2.05rem;margin-bottom:15px}.rafed-heading>p{max-width:100%}.rafed-showcase{grid-template-columns:1fr;padding:20px;gap:22px}.rafed-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px}.rafed-tab{padding:13px}.rafed-tab strong{font-size:.88rem;line-height:1.55}.rafed-tab small{display:none}.rafed-tab span{float:none;display:block;padding:0 0 4px}.screen-frame{width:245px;height:390px}.screen-viewport img{margin-top:calc(var(--image-offset,-78px) * .8)}.rafed-actions,.work-heading,.contact-box{display:block}.rafed-actions .button{margin-top:20px}.work-heading p{margin-top:12px}.work-grid{grid-template-columns:1fr;gap:16px}.work-art{height:185px}.about-grid{gap:7px}.contact-box{padding:38px 29px}.contact .button{margin-top:24px}.footer-inner{flex-wrap:wrap;gap:14px}.footer p{order:3;width:100%}}
@media(max-width:390px){.hero-actions{display:grid}.hero-visual{transform:scale(.6);margin-bottom:-130px}.rafed-tab strong{font-size:.8rem}.button{width:100%}.inline-actions .plain-link{margin:0 auto}.footer img{width:150px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Refined company presentation */
@font-face{font-family:NotoKufi;src:url('assets/NotoKufiArabic-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:NotoKufi;src:url('assets/NotoKufiArabic-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
body{font-family:NotoKufi,Arial,sans-serif;line-height:1.8;color:#142a43}
h1,h2,h3{letter-spacing:0;line-height:1.55}
p{line-height:2}
.site-header{box-shadow:none;border-bottom-color:#e5edf3}
.header-inner{height:80px}.nav{font-size:.85rem}
.hero-new{background:linear-gradient(115deg,#173657,#0b1b33 72%);isolation:isolate}
.hero-new:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 28% 25%,#30adc529,transparent 34%),linear-gradient(90deg,#ffffff08 1px,transparent 1px),linear-gradient(#ffffff08 1px,transparent 1px);background-size:auto,62px 62px,62px 62px;opacity:.55;z-index:-1}
.hero-new .hero-grid{min-height:690px;grid-template-columns:1.07fr .93fr;padding-block:80px;gap:45px}
.hero-new h1{font-size:clamp(2.45rem,4.4vw,4.3rem);line-height:1.48;max-width:680px;margin-bottom:24px}
.hero-new h1 em{color:#68dbe0}
.hero-new .hero-lead{max-width:650px;line-height:2.05}
.hero-new .hero-visual{height:545px;transform:none}
.hero-product{position:relative;display:grid;place-items:center}
.hero-product:before{content:"";position:absolute;inset:20px 48px 20px 0;border:1px solid #84bfd74a;border-radius:43% 57% 47% 53% / 48% 47% 53% 52%;transform:rotate(19deg)}
.hero-product-label{position:absolute;right:5px;top:34px;z-index:2;background:#ffffffed;border:1px solid #fff;border-radius:14px;padding:11px 17px;color:#11385a;box-shadow:0 15px 30px #0003;display:flex;align-items:center;gap:12px}
.hero-product-label b{font-size:1rem}.hero-product-label span{font-size:.75rem;color:#537087}
.hero-phone{width:300px;height:496px;border-radius:25px;overflow:hidden;border:8px solid #d6e5ef;background:#fff;box-shadow:0 32px 70px #0008;position:relative;transform:rotate(-3deg)}
.hero-phone img{width:100%;height:auto;max-width:none;display:block;margin-top:-66px}
.hero-proof{position:absolute;bottom:10px;left:-5px;z-index:2;background:#fff;color:#284766;padding:14px 18px;border-radius:13px;box-shadow:0 18px 36px #0004;font-size:.68rem;display:flex;align-items:center;gap:8px;white-space:nowrap}
.hero-proof i{height:1px;width:13px;background:#2b7ed4}.hero-proof strong{color:#1766b7}
.split-heading h2 span{color:#2b70c9}
.solution-card{border-radius:16px;box-shadow:0 9px 35px #1339530b;border-color:#dce8ef}
.solution-index{font-size:.69rem;color:#6e91aa}.solution-card h3{font-size:1.45rem}
.rafed{background:#f8fbfd;color:#122942;padding-bottom:95px}
.rafed .eyebrow.light{color:#246fc8}
.rafed-heading{margin-bottom:40px}
.rafed-heading h2{font-size:clamp(2.15rem,3.8vw,3.6rem)}
.rafed-heading>p{color:#506a7e;max-width:400px}
.pain-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:82px}
.pain-grid>div{background:#fff;border:1px solid #dbe7ee;border-top:4px solid #55c7d1;border-radius:14px;padding:27px 25px;box-shadow:0 10px 26px #123b550b}
.pain-grid span{font:700 .8rem Arial,sans-serif;color:#1b7baf}
.pain-grid h3{font-size:1.1rem;margin:16px 0 9px;min-height:3.5em}
.pain-grid p{color:#5d7282;font-size:.84rem;margin:0;line-height:1.9}
.rafed-transition{text-align:center;max-width:760px;margin:0 auto 35px}
.rafed-transition span{color:#2277b9;font-weight:700;font-size:.8rem}
.rafed-transition h3{font-size:clamp(1.55rem,2.5vw,2.5rem);margin:9px 0}
.rafed-transition p{color:#61788a;margin:0}
.rafed-showcase{background:#102744;border:0;border-radius:20px;box-shadow:0 25px 50px #0d2d4a27}
.rafed-tab.active{background:#ffffff16;border-color:#8ed0df78}
.rafed-actions{background:#e7f3f7;border-radius:15px;margin-top:25px;padding:22px 25px}
.rafed-actions div>span{color:#5d7788}.rafed-actions strong{color:#153551}
.rafed-actions .button-light{background:#246cce;color:#fff;box-shadow:none}
.websites{background:#eef5fa}
.websites-copy h2{font-size:clamp(2rem,3.2vw,3.2rem)}
.mock-browser{background:#e2ebf3}
.websites-preview{transform:rotate(1.5deg);box-shadow:0 30px 70px #10365825}
.work{background:#fff}.work-grid{grid-template-columns:minmax(0,720px);justify-content:center}.work-art{height:320px}.work-card{border-radius:16px}
.work-h2o .work-art{background:linear-gradient(135deg,#082f44,#0e7395)}
.about{background:#f4f8fb}.about-grid h2{font-size:clamp(2rem,3vw,3rem)}
.contact-box{background:linear-gradient(110deg,#1b5b9b,#0a2545 75%)}
@media(max-width:1000px){
  .hero-new .hero-grid{gap:20px}
  .hero-new .hero-visual{transform:scale(.88);transform-origin:center}
  .hero-proof{left:-38px}
}
@media(max-width:760px){
  .header-inner{height:70px}
  .hero-new .hero-grid{display:flex;min-height:0;padding-block:58px 28px;gap:22px}
  .hero-new h1{font-size:clamp(2.2rem,8vw,3.1rem)}
  .hero-new .hero-visual{height:345px;width:100%;transform:scale(.69);transform-origin:center top;margin-bottom:-100px}
  .hero-phone{width:295px}
  .hero-product-label{right:-20px}
  .hero-proof{left:-55px;bottom:5px}
  .pain-grid{grid-template-columns:1fr;gap:10px;margin-bottom:58px}
  .pain-grid>div{padding:21px}
  .pain-grid h3{min-height:0;margin:8px 0 3px}
  .rafed-heading>p{max-width:none}
  .rafed-showcase{padding:20px}
  .rafed-actions{padding:21px}
  .work-grid{grid-template-columns:1fr}
  .work-art{height:210px}
}
@media(max-width:390px){.hero-new .hero-visual{transform:scale(.59);margin-bottom:-136px}.hero-proof{left:-65px}}
