/* CLIENT 4 — نظام بصري مستقل: Mono / Electric Blue / Lime */
:root{--navy:#111216;--navy-dark:#08090c;--blue:#355cff;--blue-dark:#1636c9;--teal:#b8ff3d;--teal-dark:#6f9c16;--teal-soft:#efffcf;--whatsapp:#20c56c;--bg-soft:#f2f2f0;--panel:#e6e6e2;--accent-soft:#e4eaff;--sage-soft:#e7ebff;--surface:#fff;--ink:#17181c;--ink-dim:#70727a;--line:#d4d5d3;--card-radius:0px;--cut:70px;--font:"IBM Plex Sans Arabic","Tahoma",sans-serif;--font-display:"IBM Plex Sans Arabic","Tahoma",sans-serif}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}}body{margin:0;background:var(--bg-soft);color:var(--ink);font-family:var(--font);line-height:1.8}a{text-decoration:none;color:inherit}img{max-width:100%;display:block}ul{padding:0;margin:0;list-style:none}h1,h2,h3,h4,p{margin:0}button{font-family:inherit;cursor:pointer}:focus-visible{outline:3px solid var(--teal);outline-offset:3px}.container{max-width:1240px;margin-inline:auto;padding-inline:30px}.hero-text h1,.section-title,.why-card h4,.service-title,.article-title,.brand-logo-box .brand-name,.footer-contact-title,.ng-page-hero h1,.share-title,.sub-title,.hero-logo-card .logo-word,.why-title{font-family:var(--font-display);font-weight:800}.grid{display:grid;gap:20px}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}@media(max-width:960px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}.diamond-bg{background:var(--panel);background-image:linear-gradient(45deg,transparent 48%,var(--line) 49% 51%,transparent 52%);background-size:26px 26px}.ng-hazard-strip{height:5px;background:var(--teal)}
/* رأس / navigation */
.c4-topline{background:var(--navy);color:#aeb0b7;font-size:11px;letter-spacing:.8px;padding:9px 0}.c4-topline .container{display:flex;justify-content:space-between}.c4-topline a:hover{color:var(--teal)}.c4-eyebrow{color:var(--teal);font-weight:800}.c4-header{background:var(--surface);border-bottom:1px solid var(--line)}.c4-header-main{display:flex;align-items:center;gap:24px;min-height:105px}.brand-logo-box{display:flex;align-items:center;gap:12px}.brand-logo-box img{width:54px;height:54px;object-fit:contain;filter:grayscale(1);border:2px solid var(--navy);padding:5px}.c4-mark{width:54px;height:54px;background:var(--navy);color:var(--teal);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:20px}.c4-brand-text{display:flex;flex-direction:column}.brand-logo-box .brand-name{font-size:17px;line-height:1.2}.brand-logo-box .brand-phone{font-size:10px;color:var(--blue);letter-spacing:1px;font-weight:700}.c4-header-statement{margin-inline-start:auto;font-size:13px;line-height:1.35;color:var(--ink-dim);border-inline-start:1px solid var(--line);padding-inline-start:24px}.c4-header-statement strong{font-size:23px;color:var(--blue)}.topbar-cta{display:inline-flex!important;background:var(--blue)!important;padding:12px 18px!important;font-size:12px!important;border-radius:0!important}.menu-btn{display:none;background:var(--navy);color:var(--teal);border:0;width:44px;height:44px;align-items:center;justify-content:center;font-size:16px}.c4-nav{background:var(--navy);color:#fff}.c4-nav .container{display:flex;align-items:center;min-height:48px;gap:3px}.c4-nav a{padding:9px 15px;font-size:12px;color:#b9bbc2;font-weight:700;transition:.2s}.c4-nav a:hover,.c4-nav a.is-active{color:var(--teal);background:rgba(255,255,255,.08)}.c4-nav .home-link{color:#fff}.c4-nav-index{font-size:10px;color:var(--teal);letter-spacing:1px;margin-inline-end:14px}.c4-nav-end{margin-inline-start:auto;color:var(--teal);font-size:20px}@media(max-width:900px){.c4-header-statement,.c4-nav{display:none}.c4-header-main{min-height:78px;padding-inline:18px}.menu-btn{display:flex;margin-inline-start:auto}.topbar-cta{display:none!important}}
.ng-sidebar{position:fixed;top:0;inset-inline-end:-100%;width:min(340px,90vw);height:100%;z-index:999;background:var(--navy);color:#fff;padding:24px;transition:inset-inline-end .35s ease;border-inline-start:5px solid var(--teal);overflow-y:auto}.ng-sidebar.is-open{inset-inline-end:0}.ng-sidebar__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.ng-sidebar h5{font-size:15px;color:var(--teal);letter-spacing:1px}.ng-sidebar__close{width:38px;height:38px;background:var(--teal);border:0;color:var(--navy);font-size:16px}.ng-sidebar a{display:block;border-bottom:1px solid rgba(255,255,255,.15);padding:14px 4px;color:#cdd0d6;font-weight:700}.ng-sidebar a:hover{color:var(--teal);padding-inline-start:10px}.ng-sidebar .c4-side-call{margin-top:20px;background:var(--blue);color:#fff;border:0;text-align:center}.ng-overlay{position:fixed;inset:0;background:rgba(8,9,12,.75);display:none;z-index:998}.ng-overlay.is-open{display:block}
/* hero asymmetric */
.ng-hero{background:var(--surface);overflow:hidden}.ng-hero-slide{display:none}.ng-hero-slide.is-active{display:block}.hero-row{display:grid;grid-template-columns:1.15fr .85fr;align-items:stretch;min-height:570px}.hero-text{display:flex;flex-direction:column;justify-content:center;text-align:right;padding:75px 0}.hero-text h1{font-size:clamp(34px,5.2vw,67px);line-height:1.1;letter-spacing:-2px;color:var(--navy)}.hero-text h1:after{content:"";display:block;width:100px;height:11px;background:var(--teal);margin-top:24px}.sub-title{color:var(--blue);font-size:16px;margin-bottom:12px}.desc{color:var(--ink-dim);font-size:15px;max-width:570px;line-height:2;margin-top:20px}.ng-hero .hero-row>div:last-child{background:var(--blue);position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}.ng-hero .hero-row>div:last-child:before{content:"04";position:absolute;font-weight:800;font-size:250px;line-height:1;color:rgba(255,255,255,.08);bottom:-40px;inset-inline-start:-30px}.ng-hero .hero-row>div:last-child:after{content:"";position:absolute;width:300px;height:300px;border:1px solid var(--teal);transform:rotate(45deg);top:15%;inset-inline-end:10%}.hero-logo-card{position:relative;z-index:2;background:var(--surface);padding:22px;text-align:center;width:78%;box-shadow:15px 15px 0 var(--navy)}.hero-logo-card img{max-width:100%;filter:grayscale(1)}.hero-logo-card .logo-word{color:var(--navy);font-size:18px;margin-top:10px}.ng-hero .hero-logo-card{background:#fff;border:0}.ng-hero .hero-logo-card img{max-width:180px}.ng-divider{display:flex;align-items:center;margin:18px 0 22px}.ng-divider.centered{justify-content:center}.ng-divider span{height:5px;width:45px;background:var(--teal)}.ng-divider i{color:var(--blue);font-size:15px;margin:0 12px}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px;justify-content:flex-start}.btn-call,.btn-whatsapp,.ng-btn{border:0;padding:13px 24px;font-weight:800;font-size:13.5px;display:inline-flex;align-items:center;gap:8px;transition:.25s;border-radius:0}.btn-call{background:var(--navy);color:#fff}.btn-call:hover{background:var(--blue);transform:translateY(-3px)}.btn-whatsapp{background:var(--whatsapp);color:#fff}.ng-btn-outline{background:transparent;color:var(--navy);border:2px solid var(--navy)}.ng-btn-outline:hover{background:var(--navy);color:#fff}.hero-dots{display:flex;gap:8px;margin-top:26px}.hero-dots button{width:28px;height:5px;border:0;background:var(--line);padding:0}.hero-dots button.is-active{background:var(--blue);width:55px}@media(max-width:860px){.hero-row{grid-template-columns:1fr;min-height:auto}.hero-text{text-align:center;padding:60px 0 35px}.hero-text h1:after{margin-inline:auto}.hero-actions,.hero-dots{justify-content:center}.ng-hero .hero-row>div:last-child{min-height:350px}.hero-logo-card{width:70%}}
/* sections */
.section-title{font-size:clamp(27px,3.8vw,41px);color:var(--navy);text-align:center}.section-lead{text-align:center;color:var(--ink-dim);max-width:650px;margin:0 auto}.ng-services{padding:80px 0;background:var(--panel)}.ng-services .grid-3{gap:20px}.service-card{background:var(--surface);display:flex;flex-direction:column;height:100%;position:relative;border:1px solid var(--line);box-shadow:7px 7px 0 var(--navy);transition:.25s}.service-card:hover{transform:translate(-4px,-4px);box-shadow:12px 12px 0 var(--blue)}.service-card:nth-child(odd){margin-top:35px}.service-card:before{content:"";position:absolute;top:0;inset-inline-start:0;width:10px;height:100%;background:var(--teal);z-index:2}.service-img{aspect-ratio:4/3;overflow:hidden}.service-img img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:.5s}.service-card:hover .service-img img{filter:grayscale(0);transform:scale(1.06)}.service-body{padding:20px 24px;display:flex;flex-direction:column;align-items:flex-start}.service-title{font-size:17px;color:var(--navy);margin-bottom:12px}.service-btn{background:var(--blue);color:#fff;padding:8px 15px;font-size:12px;font-weight:800}.service-btn:hover{background:var(--navy)}@media(max-width:700px){.service-card:nth-child(odd){margin-top:0}}
.ng-offers{padding:75px 0}.article-card{background:var(--surface);height:100%;border:1px solid var(--line);position:relative}.article-img-wrap{aspect-ratio:16/10;overflow:hidden;position:relative}.article-img-wrap img{width:100%;height:100%;object-fit:cover;filter:grayscale(1)}.article-card:hover img{filter:grayscale(0)}.article-badge{position:absolute;top:0;inset-inline-end:0;background:var(--teal);color:var(--navy);padding:6px 13px;font-size:10px;font-weight:900}.article-avatar{position:absolute;bottom:12px;inset-inline-start:14px;width:38px;height:38px;display:flex;align-items:center;justify-content:center;background:var(--blue);color:#fff}.article-body{padding:22px}.article-title{color:var(--navy);font-size:17px}.article-desc{color:var(--ink-dim);font-size:14px;line-height:1.9;margin:10px 0}.article-more{color:var(--blue);font-weight:800}.ng-why-us{padding:78px 0;background:var(--navy)}.why-title{color:#fff;text-align:center;font-size:clamp(25px,3.3vw,36px)}.ng-why-us .ng-divider i{color:var(--teal)}.why-card{background:#1d1f26;color:#fff;padding:25px 22px;display:grid;grid-template-columns:55px 1fr;gap:14px;border-inline-start:5px solid var(--teal);height:100%}.why-icon-circle{width:50px;height:50px;display:flex;align-items:center;justify-content:center;background:var(--teal);color:var(--navy);border-radius:0;font-size:18px}.why-card h4{font-size:16px;margin-bottom:5px}.why-card p{color:#adb0b7;font-size:13.5px;line-height:1.8;grid-column:2}.ng-stats{background:var(--teal);padding:0}.ng-stats .container{display:grid;grid-template-columns:repeat(4,1fr)}.stat-block{text-align:center;padding:37px 15px;border-inline-start:1px solid rgba(17,18,22,.25)}.stat-block:first-child{border:0}.stat-block strong{display:block;font-size:clamp(30px,4vw,46px);color:var(--navy);line-height:1;font-weight:800}.stat-block span{display:block;margin-top:8px;color:var(--navy);font-size:12px;font-weight:800}@media(max-width:768px){.ng-stats .container{grid-template-columns:repeat(2,1fr)}}.ng-cta-banner{background:var(--navy);color:#fff;padding:55px 45px;margin:60px 30px;position:relative;overflow:hidden}.ng-cta-banner:before{content:"→";position:absolute;font-size:260px;color:rgba(255,255,255,.04);left:0;top:-90px}.ng-cta-banner .container{display:flex;justify-content:space-between;align-items:center;gap:24px;position:relative;z-index:2;flex-wrap:wrap;padding:0;max-width:100%}.ng-cta-banner h3{color:var(--teal);font-size:clamp(22px,3vw,34px)}.ng-cta-banner p{color:#bbbfc8}.ng-cta-banner .hero-actions{margin-top:0}.ng-cta-banner .btn-call{background:var(--blue)}
/* inner */
.ng-page-hero{background:var(--navy);color:#fff;padding:70px 0;position:relative;overflow:hidden}.ng-page-hero:after{content:"04";position:absolute;font-size:260px;font-weight:800;color:rgba(255,255,255,.04);left:5%;top:-75px}.ng-page-hero h1{color:var(--teal);font-size:clamp(30px,4vw,48px);position:relative;z-index:1}.ng-page-hero p{color:#c1c4cb;max-width:700px;margin-top:10px;position:relative;z-index:1}.ng-breadcrumbs{color:var(--teal);font-size:12px;font-weight:800;position:relative;z-index:1;margin-bottom:12px}.ng-breadcrumbs a{color:#aeb0b7}.ng-filters{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:30px}.ng-filter-pill{border:1px solid var(--navy);padding:9px 17px;color:var(--navy);font-weight:800;font-size:12px}.ng-filter-pill:hover,.ng-filter-pill.is-active{background:var(--blue);color:#fff;border-color:var(--blue)}.ng-pagination{display:flex;justify-content:center;gap:7px;margin-top:40px}.ng-pagination a,.ng-pagination span{min-width:38px;height:38px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-weight:800}.ng-pagination .is-active{background:var(--navy);color:var(--teal)}.ng-gallery-item{aspect-ratio:4/3;position:relative;overflow:hidden;cursor:zoom-in}.ng-gallery-item img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:.5s}.ng-gallery-item:hover img{filter:grayscale(0);transform:scale(1.08)}.ng-gallery-item__overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,9,12,.9),transparent 65%);display:flex;align-items:flex-end;padding:14px;opacity:0;transition:.3s}.ng-gallery-item:hover .ng-gallery-item__overlay{opacity:1}.ng-gallery-item__overlay span{color:#fff;font-size:12px;font-weight:800}.ng-lightbox{position:fixed;inset:0;background:rgba(8,9,12,.95);z-index:1100;display:none;align-items:center;justify-content:center;padding:30px}.ng-lightbox.is-open{display:flex}.ng-lightbox img{max-width:92vw;max-height:86vh}.ng-lightbox__close,.ng-lightbox__nav{position:absolute;width:44px;height:44px;border:0;background:var(--teal);color:var(--navy);display:flex;align-items:center;justify-content:center}.ng-lightbox__close{top:20px;inset-inline-end:20px}.ng-lightbox__prev{left:20px;top:50%}.ng-lightbox__next{right:20px;top:50%}.ng-card{background:var(--surface);border:1px solid var(--line);padding:35px}.ng-field{margin-bottom:17px}.ng-field label{display:block;font-size:13px;font-weight:800;color:var(--navy);margin-bottom:7px}.ng-field input,.ng-field select,.ng-field textarea{width:100%;background:var(--bg-soft);border:1px solid var(--line);padding:13px 15px;font-family:inherit;font-size:14px}.ng-field input:focus,.ng-field select:focus,.ng-field textarea:focus{border-color:var(--blue);background:#fff}.ng-field textarea{min-height:120px}.ng-alert{padding:15px 18px;margin-bottom:18px;border-inline-start:5px solid var(--blue);font-size:14px;font-weight:700}.ng-alert-ok{background:var(--teal-soft)}.ng-alert-err{background:#fbe4e2}.ng-info-row{display:flex;gap:13px;margin-bottom:16px}.ng-info-row i{width:42px;height:42px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center}.ng-info-row h4{font-size:14px}.ng-info-row p,.ng-info-row a{color:var(--ink-dim);font-size:13px}.ng-share{text-align:center;padding:18px 0 50px}.share-title{font-size:19px;color:var(--navy);margin-bottom:18px}.share-icons{display:flex;justify-content:center;gap:10px}.share-icons a{width:42px;height:42px;background:var(--navy);color:var(--teal);display:flex;align-items:center;justify-content:center}.share-icons a.wa{background:var(--whatsapp);color:#fff}.share-icons a.fb{background:var(--blue);color:#fff}.ng-keywords{text-align:center;padding:18px}.ng-keywords a{display:inline-block;margin:5px;padding:7px 14px;border:1px solid var(--line);font-size:12px}.ng-reveal{opacity:0;transform:translateY(20px);transition:.5s}.ng-reveal.is-visible{opacity:1;transform:none}
/* footer */
.footer-dark{background:var(--navy);color:#fff}.c4-footer-head{display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:35px;align-items:center;padding-top:55px;padding-bottom:50px;border-bottom:1px solid rgba(255,255,255,.15)}.c4-footer-big{font-size:clamp(52px,8vw,100px);font-weight:800;line-height:.78;color:#fff;letter-spacing:-5px}.c4-footer-big span{color:var(--teal)}.c4-footer-contact{border-inline-start:1px solid rgba(255,255,255,.2);padding-inline-start:30px}.footer-contact-title{font-size:23px;color:var(--teal);margin-bottom:10px}.footer-contact-text{color:#b9bbc2;font-size:13px;line-height:1.9;margin-bottom:15px}.c4-footer-contact .ng-btn{background:var(--blue);color:#fff}.c4-footer-coordinates{display:flex;flex-direction:column;gap:8px;color:#8f929b;font-size:10px;letter-spacing:1px}.c4-footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-top:40px;padding-bottom:45px}.c4-label{color:var(--teal);font-size:11px;font-weight:800;letter-spacing:1px;margin-bottom:15px}.footer-map iframe,.footer-map .map-placeholder{width:100%;height:200px;border:0;filter:grayscale(1)}.footer-links{display:flex;flex-direction:column;gap:8px}.footer-links a{color:#b9bbc2;font-size:13px}.footer-links a:hover{color:var(--teal)}.footer-icons{display:flex;gap:8px}.footer-icons a{width:38px;height:38px;border:1px solid rgba(255,255,255,.25);color:#fff;display:flex;align-items:center;justify-content:center}.footer-icons a:hover{background:var(--teal);color:var(--navy)}.copyright-bar{background:var(--navy-dark);padding:19px;text-align:center;color:#858891;font-size:11px;letter-spacing:.6px}.copyright-bar strong{color:var(--teal);margin-inline-start:10px}.fab-wrap{position:fixed;bottom:24px;inset-inline-start:22px;z-index:900;display:flex;flex-direction:column;gap:9px}.fab-wrap.is-hidden{display:none}.fab-circle{width:50px;height:50px;display:flex;align-items:center;justify-content:center;border:0;color:#fff;border-radius:0}.fab-circle.call{background:var(--navy)}.fab-circle.wat{background:var(--whatsapp)}.fab-circle.close{background:var(--blue);font-size:13px}@media(max-width:800px){.c4-footer-head{grid-template-columns:1fr 1fr}.c4-footer-coordinates{display:none}.c4-footer-grid{grid-template-columns:1fr 1fr}}@media(max-width:560px){.c4-footer-head,.c4-footer-grid{grid-template-columns:1fr}.c4-footer-contact{border:0;padding:0}.ng-cta-banner{margin-inline:16px;padding:40px 25px}.ng-cta-banner .container{justify-content:center;text-align:center}.ng-cta-banner .hero-actions{justify-content:center}}.ng-error-page{min-height:55vh;display:flex;align-items:center;justify-content:center;text-align:center}.ng-error-page h1{font-size:clamp(56px,9vw,110px);color:var(--navy)}
