  :root{
    --bg:#05060d;
    --bg-soft:#0a0d1b;
    --purple:#8b5cf6;
    --blue:#3b82f6;
    --cyan:#22d3ee;
    --pink:#ec4899;
    --green:#10b981;
    --orange:#f97316;
    --text:#eef0fb;
    --muted:#8b8fa8;
    --border:rgba(255,255,255,.08);
    --card:rgba(255,255,255,.03);
    --grad: linear-gradient(90deg,var(--purple),var(--blue));
  }

  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;overflow-x:hidden;overflow-x:clip;max-width:100vw;}
  body{
    font-family:'Tajawal','Cairo',sans-serif;
    background:var(--bg);
    color:var(--text);
    overflow-x:hidden;
    overflow-x:clip;
    position:relative;
    min-height:100vh;
    max-width:100vw;
  }

  /* ============ STARFIELD BACKGROUND ============ */
  #starfield{
    position:fixed;
    top:0;left:0;
    width:100vw;height:100vh;
    z-index:0;
    background:radial-gradient(ellipse at 50% 0%, #0d1024 0%, #05060d 55%, #020208 100%);
  }

  div.page{position:relative;z-index:1;}

  a{text-decoration:none;color:inherit;}
  button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
  ul{list-style:none;}
  img{max-width:100%;display:block;}
  section{position:relative;padding:110px 6vw;}
  .container{max-width:1300px;margin:0 auto;}

  ::selection{background:var(--purple);color:#fff;}

  /* ============ SCROLLBAR ============ */
  ::-webkit-scrollbar{width:10px;}
  ::-webkit-scrollbar-track{background:var(--bg);}
  ::-webkit-scrollbar-thumb{background:linear-gradient(var(--purple),var(--blue));border-radius:10px;}

  /* ============ NAVBAR (premium) ============ */
  section{scroll-margin-top:96px;}
  .scroll-progress{position:fixed;top:0;left:0;height:2px;width:0;z-index:60;background:linear-gradient(90deg,var(--purple),var(--cyan));box-shadow:0 0 10px rgba(139,92,246,.8);}
  [dir=rtl] .scroll-progress{left:auto;right:0;background:linear-gradient(270deg,var(--purple),var(--cyan));}
  header.navbar{position:fixed;top:14px;left:0;right:0;z-index:50;padding:0 4vw;}
  #hero.hero{padding-top:150px;}
  .nav-inner{
    position:relative;max-width:1180px;margin:0 auto;
    display:flex;align-items:center;justify-content:space-between;gap:20px;
    padding:10px 12px 10px 18px;border-radius:20px;
    background:rgba(10,12,26,.45);
    backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
    border:1px solid rgba(255,255,255,.07);
    box-shadow:0 20px 50px -30px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.05);
    transition:background .35s, box-shadow .35s, padding .35s, border-color .35s;
  }
  [dir=rtl] .nav-inner{padding:10px 18px 10px 12px;}
  header.navbar.scrolled .nav-inner{
    background:rgba(8,9,20,.8);border-color:rgba(139,92,246,.25);
    box-shadow:0 24px 60px -24px rgba(0,0,0,.95), 0 0 30px -12px rgba(139,92,246,.35);
    padding-top:7px;padding-bottom:7px;
  }
  .brand{display:flex;align-items:center;gap:12px;}
  .brand img.logo-img{height:42px;width:auto;object-fit:contain;border-radius:10px;transition:height .35s;}
  header.navbar.scrolled .brand img.logo-img{height:36px;}
  .brand-text{display:flex;flex-direction:column;line-height:1.15;}
  .brand-text b{font-size:16px;font-weight:800;letter-spacing:.3px;}
  .brand-text span{font-size:11px;color:var(--muted);}

  nav.menu{position:relative;display:flex;align-items:center;gap:2px;padding:5px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.05);}
  nav.menu a{position:relative;z-index:1;padding:9px 16px;border-radius:10px;font-size:14px;font-weight:700;color:#aeb2c8;transition:color .25s;white-space:nowrap;}
  nav.menu a:hover,nav.menu a.active{color:#fff;}
  .menu-pill{position:absolute;top:5px;bottom:5px;left:0;width:0;border-radius:10px;opacity:0;
    background:linear-gradient(135deg,rgba(139,92,246,.35),rgba(59,130,246,.22));
    border:1px solid rgba(139,92,246,.45);box-shadow:0 6px 20px -8px rgba(139,92,246,.75);
    transition:left .45s cubic-bezier(.2,.7,.2,1), width .45s cubic-bezier(.2,.7,.2,1), opacity .3s;}

  .nav-actions{display:flex;align-items:center;gap:10px;}
  .lang-btn{display:flex;align-items:center;gap:7px;padding:9px 13px;border-radius:12px;border:1px solid var(--border);background:rgba(255,255,255,.03);font-size:13px;font-weight:800;color:#dfe1f2;transition:.25s;}
  .lang-btn:hover{border-color:var(--cyan);color:var(--cyan);}
  .lang-btn svg{width:16px;height:16px;}
  .nav-cta{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:12px;background:var(--grad);color:#fff;font-size:13.5px;font-weight:800;white-space:nowrap;box-shadow:0 10px 26px -10px rgba(139,92,246,.8);transition:transform .3s, box-shadow .3s;}
  .nav-cta::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);animation:shine 5s ease-in-out infinite 1.5s;}
  .nav-cta:hover{transform:translateY(-2px);box-shadow:0 14px 30px -10px rgba(139,92,246,.95);}
  .nav-cta svg{width:15px;height:15px;}
  [dir=rtl] .nav-cta svg{transform:scaleX(-1);}

  .burger{display:none;width:42px;height:42px;border-radius:12px;border:1px solid var(--border);background:rgba(255,255,255,.03);flex-direction:column;align-items:center;justify-content:center;gap:5px;}
  .burger span{display:block;width:18px;height:2px;border-radius:2px;background:#dfe1f2;transition:transform .3s, opacity .3s;}
  .burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .burger.open span:nth-child(2){opacity:0;}
  .burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  .mobile-menu{display:none;max-width:1180px;margin:10px auto 0;padding:10px;border-radius:20px;flex-direction:column;gap:4px;
    background:rgba(8,9,20,.94);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
    border:1px solid rgba(139,92,246,.25);box-shadow:0 30px 60px -20px rgba(0,0,0,.9);
    animation:menuIn .3s cubic-bezier(.2,.7,.2,1);}
  .mobile-menu.open{display:flex;}
  @keyframes menuIn{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}
  .mobile-menu a{padding:14px 16px;border-radius:12px;font-size:15px;font-weight:700;color:#cfd2e6;}
  .mobile-menu a:hover,.mobile-menu a.active{background:rgba(139,92,246,.12);color:#fff;}
  .mobile-menu a.nav-cta{justify-content:center;margin-top:6px;padding:14px;color:#fff;background:var(--grad);}
  @media(max-width:1050px){ .burger{display:flex;} }
  @media(max-width:680px){
    header.navbar{top:10px;padding:0 12px;}
    #hero.hero{padding-top:110px;}
    .nav-actions .nav-cta{display:none;}
    .brand img.logo-img{height:36px;}
  }
  @keyframes shine{0%,60%{left:-60%}100%{left:130%}}

  /* ============ REVEAL ANIMATIONS ============ */
  [data-anim]{opacity:0;transition:opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1);}
  [data-anim="up"]{transform:translateY(46px);}
  [data-anim="right"]{transform:translateX(60px);}
  [data-anim="left"]{transform:translateX(-60px);}
  [data-anim].in-view{opacity:1;transform:translate(0,0);}

  /* ============ BADGE ============ */
  .badge{
    display:inline-flex;align-items:center;gap:8px;
    padding:8px 16px;border-radius:999px;
    background:rgba(139,92,246,.12);
    border:1px solid rgba(139,92,246,.35);
    font-size:13px;font-weight:700;color:#d8c9ff;
    margin-bottom:22px;
  }

  .grad-text{
    background:linear-gradient(92deg,#fff 5%, var(--purple) 55%, var(--cyan) 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }

  /* ============ HERO (premium globe) ============ */
  .hero{display:flex;align-items:center;justify-content:space-between;gap:56px;padding-top:70px;padding-bottom:70px;min-height:88vh;}
  .hero-text{flex:1;max-width:640px;}
  .badge .pulse{width:8px;height:8px;border-radius:50%;background:#22d3ee;animation:ping 2s infinite;flex-shrink:0;}
  @keyframes ping{0%{box-shadow:0 0 0 0 rgba(34,211,238,.6)}70%{box-shadow:0 0 0 9px rgba(34,211,238,0)}100%{box-shadow:0 0 0 0 rgba(34,211,238,0)}}
  .hero-text h1{font-size:clamp(36px,4.8vw,60px);font-weight:900;line-height:1.3;margin-bottom:22px;}
  .hero-text h1 .l1{display:block;color:#f4f5ff;}
  .hero-text h1 .l2{display:block;padding-bottom:4px;}
  .hero-text p{font-size:17px;line-height:2;color:#b7bad0;margin-bottom:36px;max-width:540px;}

  .btn-row{display:flex;gap:14px;margin-bottom:46px;flex-wrap:wrap;}
  .btn{
    display:inline-flex;align-items:center;gap:10px;
    padding:15px 28px;border-radius:14px;font-weight:800;font-size:15px;
    transition:.3s transform, .3s box-shadow, .3s background, .3s border-color, .3s color;
  }
  .btn svg{width:17px;height:17px;}
  .btn-primary{position:relative;overflow:hidden;background:var(--grad);color:#fff;box-shadow:0 14px 34px -10px rgba(139,92,246,.7);}
  .btn-primary::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);animation:shine 4.5s ease-in-out infinite;}
  @keyframes shine{0%,60%{left:-60%}100%{left:130%}}
  .btn-primary:hover{transform:translateY(-3px);box-shadow:0 20px 40px -10px rgba(139,92,246,.85);}
  [dir=rtl] .btn-primary svg{transform:scaleX(-1);}
  .btn-outline{border:1px solid var(--border);color:#dfe1f2;background:rgba(255,255,255,.03);backdrop-filter:blur(8px);}
  .btn-outline:hover{border-color:var(--cyan);color:var(--cyan);transform:translateY(-3px);}

  .stats{display:inline-flex;align-items:center;padding:16px 6px;border-radius:18px;background:rgba(255,255,255,.03);border:1px solid var(--border);backdrop-filter:blur(10px);}
  .stat{padding:0 26px;}
  .stat + .stat{border-inline-start:1px solid var(--border);}
  .stat b{display:block;font-size:28px;font-weight:900;background:linear-gradient(90deg,var(--purple),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent;}
  .stat span{font-size:13px;color:var(--muted);font-weight:600;}

  .hero-visual{position:relative;flex:0 0 480px;height:480px;}
  .globe-float{position:absolute;inset:0;animation:floaty 7s ease-in-out infinite;}
  @keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
  .globe-glow{position:absolute;inset:10%;border-radius:50%;background:radial-gradient(circle,rgba(139,92,246,.5),rgba(59,130,246,.18) 45%,transparent 70%);filter:blur(34px);}
  #globe{position:absolute;inset:0;width:100%;height:100%;display:block;}
  .orbits{position:absolute;left:-4%;top:-4%;width:108%;height:108%;pointer-events:none;overflow:visible;}
  .orbits .orb{fill:none;stroke:rgba(139,92,246,.35);stroke-width:1;stroke-dasharray:2 7;}
  .orbits .orb2{stroke:rgba(34,211,238,.28);}
  .orbits .sat{fill:#67e8f9;filter:drop-shadow(0 0 6px #22d3ee);}
  .orbits .sat2{fill:#f9a8d4;filter:drop-shadow(0 0 6px #ec4899);}
  .h-chip{position:absolute;z-index:2;display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:14px;background:rgba(12,14,30,.62);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 20px 40px -18px rgba(0,0,0,.85);white-space:nowrap;animation:floaty 6s ease-in-out infinite;}
  .h-chip i{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-style:normal;color:#fff;flex-shrink:0;}
  .h-chip i svg{width:15px;height:15px;}
  .h-chip b{display:block;font-size:12.5px;font-weight:800;}
  .h-chip small{display:block;font-size:11px;color:var(--muted);unicode-bidi:plaintext;font-family:ui-monospace,Consolas,monospace;}
  .h-chip.c1{top:8%;right:-3%;}
  .h-chip.c2{bottom:20%;left:-7%;animation-delay:-2s;}
  .h-chip.c3{bottom:1%;right:12%;animation-delay:-4s;}
  @keyframes twinkleDot{0%,100%{opacity:.35;}50%{opacity:1;}}

  /* ============ SECTION HEAD ============ */
  .sec-head{text-align:center;max-width:640px;margin:0 auto 60px;}
  .sec-head h2{font-size:clamp(28px,3.6vw,42px);font-weight:900;margin-bottom:14px;}
  .sec-head p{color:var(--muted);font-size:15.5px;}

  /* ============ SERVICES ============ */
  .services-grid{
    display:grid;grid-template-columns:repeat(4,1fr);gap:22px;
  }
  .service-card{
    background:var(--card);border:1px solid var(--border);
    border-radius:20px;padding:34px 26px;
    transition:.35s transform,.35s border-color, .35s background;
  }
  .service-card:hover{
    transform:translateY(-8px);
    border-color:rgba(139,92,246,.4);
    background:rgba(139,92,246,.05);
  }
  .service-icon{
    width:52px;height:52px;border-radius:14px;
    display:flex;align-items:center;justify-content:center;margin-bottom:20px;
    transition:transform .2s;
  }
  .service-icon:hover{animation:spinThrice 1.05s ease-out;}
  .service-icon svg{width:24px;height:24px;color:#fff;}
  .icon-green{background:linear-gradient(135deg,#10b981,#059669);}
  .icon-purple{background:linear-gradient(135deg,#8b5cf6,#6366f1);}
  .icon-pink{background:linear-gradient(135deg,#ec4899,#db2777);}
  .icon-cyan{background:linear-gradient(135deg,#22d3ee,#0891b2);}
  .service-card h3{font-size:18px;font-weight:800;margin-bottom:10px;}
  .service-card p{font-size:14px;color:var(--muted);line-height:1.8;}

  .more-pill{
    display:block;width:max-content;margin:44px auto 0;
    padding:11px 22px;border-radius:999px;
    border:1px solid var(--border);background:var(--card);
    font-size:13.5px;color:#cfd2e6;font-weight:700;
  }

  /* ============ ABOUT (premium) ============ */
  .about-wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:56px;align-items:center;}
  .about-text h2{font-size:clamp(30px,3.8vw,46px);font-weight:900;line-height:1.3;}
  .about-text .sub{color:#c4b5fd;font-size:16.5px;font-weight:700;margin:6px 0 18px;}
  .about-text p.lead{color:#b7bad0;font-size:16px;line-height:2.05;margin-bottom:26px;}
  .vm-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:22px;}
  .vm{padding:20px;border-radius:20px;}
  .vm h4{display:flex;align-items:center;gap:10px;font-size:15.5px;font-weight:900;margin-bottom:8px;}
  .vm h4 i{width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-style:normal;color:#fff;flex-shrink:0;}
  .vm h4 i svg{width:16px;height:16px;}
  .vm p{font-size:13.5px;color:#a9adc4;line-height:1.85;}
  .about-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px;}
  .about-tags span{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#dfe1f2;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.035);border:1px solid var(--border);}
  .about-tags span::before{content:"";width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,var(--purple),var(--cyan));box-shadow:0 0 8px rgba(139,92,246,.8);}
  .about-cta{display:flex;gap:12px;flex-wrap:wrap;}
  [dir=rtl] .about-cta .btn-primary svg{transform:scaleX(-1);}

  .bento{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
  .reach{grid-column:1/-1;padding:28px 30px;display:flex;align-items:center;gap:26px;overflow:hidden;}
  .reach::after{content:"";position:absolute;width:300px;height:300px;top:-160px;inset-inline-end:-100px;background:radial-gradient(circle,rgba(139,92,246,.4),transparent 65%);pointer-events:none;}
  .reach > *{position:relative;z-index:1;}
  .reach-item{flex:1;display:flex;flex-direction:column;gap:6px;}
  .reach-item b{font-size:40px;font-weight:900;line-height:1.1;background:linear-gradient(90deg,var(--purple),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent;width:max-content;}
  .reach-item small{font-size:13.5px;color:#a9adc4;font-weight:700;}
  .reach-sep{width:1px;align-self:stretch;background:linear-gradient(180deg,transparent,var(--border),transparent);}
  .flags{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap;}
  .flags span{font-size:11px;font-weight:900;letter-spacing:.12em;padding:6px 10px;border-radius:9px;color:#fff;}
  .f-ksa{background:linear-gradient(135deg,#10b981,#047857);}
  .f-egy{background:linear-gradient(135deg,#8b5cf6,#4f46e5);}
  .f-uae{background:linear-gradient(135deg,#22d3ee,#2563eb);}
  .mini-line{display:flex;gap:5px;margin-top:10px;}
  .mini-line i{width:22px;height:6px;border-radius:999px;background:linear-gradient(90deg,var(--purple),var(--cyan));opacity:.35;}
  .mini-line i:nth-child(2){opacity:.5}.mini-line i:nth-child(3){opacity:.65}.mini-line i:nth-child(4){opacity:.8}.mini-line i:nth-child(5){opacity:1}
  .val{padding:24px 22px;display:flex;flex-direction:column;gap:10px;overflow:hidden;transition:opacity .9s ease, transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s;}
  .val > *{position:relative;z-index:1;}
  .val::after{content:"";position:absolute;width:200px;height:200px;bottom:-120px;inset-inline-start:-70px;background:radial-gradient(circle,var(--glow),transparent 70%);opacity:.3;transition:opacity .45s;pointer-events:none;}
  .val:hover{transform:translateY(-6px);box-shadow:0 34px 70px -34px var(--glow);}
  .val:hover::after{opacity:.7;}
  .val .service-icon{margin-bottom:4px;}
  .val h4{font-size:17px;font-weight:900;}
  .val p{font-size:13.5px;color:#a9adc4;line-height:1.85;}
  .service-icon:hover{animation:spinThrice 1.05s ease-out;}
  @keyframes spinThrice{from{transform:rotate(0deg);}to{transform:rotate(720deg);}}
  .icon-indigo{background:linear-gradient(135deg,#6366f1,#4338ca);}
  @media(max-width:1050px){ .about-wrap{grid-template-columns:1fr;gap:40px;} }
  @media(max-width:680px){
    .vm-grid{grid-template-columns:1fr;}
    .bento{grid-template-columns:1fr;}
    .reach{flex-direction:column;align-items:flex-start;padding:24px;}
    .reach-sep{width:100%;height:1px;align-self:auto;background:linear-gradient(90deg,transparent,var(--border),transparent);}
    .about-cta .btn{flex:1 1 100%;justify-content:center;}
  }

  /* ============ PORTFOLIO (premium) ============ */
  .spec-row{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin:-26px auto 52px;}
  .spec{display:inline-flex;align-items:center;gap:10px;padding:9px 18px 9px 9px;border-radius:999px;background:rgba(255,255,255,.035);border:1px solid var(--border);font-size:13.5px;font-weight:700;color:#dfe1f2;}
  [dir=rtl] .spec{padding:9px 9px 9px 18px;}
  .spec i{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-style:normal;color:#fff;}
  .spec i svg{width:14px;height:14px;}

  .suite{padding:44px 42px;overflow:hidden;margin-bottom:26px;}
  .suite::after{content:"";position:absolute;width:560px;height:560px;top:-300px;left:50%;margin-left:-280px;background:radial-gradient(circle,rgba(139,92,246,.28),transparent 65%);pointer-events:none;}
  .suite > *{position:relative;z-index:1;}
  .suite-head{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;flex-wrap:wrap;margin-bottom:34px;}
  .suite-head h3{font-size:clamp(24px,2.8vw,34px);font-weight:900;margin:12px 0 10px;line-height:1.35;}
  .suite-head p{color:#a9adc4;font-size:14.5px;line-height:1.95;max-width:620px;}
  .feat-list{display:flex;flex-wrap:wrap;gap:8px;max-width:430px;}
  .feat-list span{font-size:12px;font-weight:700;padding:7px 13px;border-radius:999px;background:rgba(139,92,246,.1);border:1px solid rgba(139,92,246,.3);color:#d8c9ff;}
  .suite-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}

  .prod{border-radius:22px;background:rgba(5,6,13,.6);border:1px solid var(--border);overflow:hidden;display:flex;flex-direction:column;transition:opacity .9s ease,transform .45s cubic-bezier(.2,.7,.2,1),border-color .45s,box-shadow .45s;}
  .prod:hover{transform:translateY(-6px);border-color:var(--acc);box-shadow:0 40px 80px -40px var(--acc);}
  .prod.p1{--acc:rgba(236,72,153,.6);--btn:linear-gradient(90deg,#ec4899,#8b5cf6);}
  .prod.p2{--acc:rgba(34,211,238,.55);--btn:linear-gradient(90deg,#22d3ee,#3b82f6);}
  .prod-visual{height:250px;position:relative;background:radial-gradient(ellipse at 30% 0%,var(--acc),transparent 62%),#070814;border-bottom:1px solid var(--border);overflow:hidden;}
  .prod-body{padding:24px 24px 22px;display:flex;flex-direction:column;gap:12px;flex:1;}
  .prod-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}
  .prod-body h4{font-size:22px;font-weight:900;}
  .prod-body p{font-size:13.5px;color:#a9adc4;line-height:1.9;flex:1;}
  .prod-tags{display:flex;flex-wrap:wrap;gap:6px;}
  .prod-tags span{font-size:11.5px;font-weight:700;padding:5px 10px;border-radius:8px;background:rgba(255,255,255,.05);border:1px solid var(--border);color:#cfd2e6;}
  .visit{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin-top:6px;padding:13px 18px;border-radius:12px;font-size:13.5px;font-weight:800;color:#fff;background:var(--btn);transition:transform .3s,box-shadow .3s;}
  .visit:hover{transform:translateY(-2px);box-shadow:0 16px 32px -12px var(--acc);}
  .visit svg{width:15px;height:15px;}
  [dir=rtl] .visit svg{transform:scaleX(-1);}
  .type{font-size:11px;font-weight:900;letter-spacing:.14em;padding:6px 10px;border-radius:8px;color:#fff;}
  .type.b2c{background:linear-gradient(135deg,#ec4899,#a855f7);}
  .type.b2b{background:linear-gradient(135deg,#22d3ee,#2563eb);}
  .nda{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:#fbbf24;padding:5px 10px;border-radius:999px;background:rgba(251,191,36,.08);border:1px solid rgba(251,191,36,.3);}
  .nda svg{width:12px;height:12px;}

  .mock-win{position:absolute;top:24px;left:24px;right:24px;bottom:-30px;border-radius:14px;background:#0c0e1d;border:1px solid rgba(255,255,255,.1);box-shadow:0 30px 60px -20px rgba(0,0,0,.85);overflow:hidden;direction:ltr;text-align:left;transition:transform .6s cubic-bezier(.2,.7,.2,1);}
  .prod:hover .mock-win{transform:translateY(-8px);}
  .mock-bar{height:30px;display:flex;align-items:center;gap:6px;padding:0 12px;background:rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.06);}
  .mock-bar i{width:9px;height:9px;border-radius:50%;background:#3a3d55;flex-shrink:0;}
  .mock-bar i:nth-child(1){background:#ff5f57;}.mock-bar i:nth-child(2){background:#febc2e;}.mock-bar i:nth-child(3){background:#28c840;}
  .mock-bar .url{margin-left:10px;flex:1;height:17px;border-radius:6px;background:rgba(255,255,255,.05);font-size:9.5px;color:#8b8fa8;display:flex;align-items:center;padding:0 8px;font-family:ui-monospace,Consolas,monospace;letter-spacing:.05em;}
  .store-hero{padding:14px 16px 8px;}
  .store-hero b{display:block;font-size:14px;font-weight:900;color:#fff;}
  .store-hero small{font-size:10px;color:#8b8fa8;}
  .store-cats{display:flex;gap:6px;padding:4px 16px 10px;flex-wrap:wrap;}
  .store-cats span{font-size:9px;font-weight:800;padding:4px 9px;border-radius:999px;background:rgba(255,255,255,.06);color:#cfd2e6;}
  .store-cats span:first-child{background:linear-gradient(90deg,#ec4899,#8b5cf6);color:#fff;}
  .store-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:0 16px;}
  .tile{border-radius:10px;padding:7px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);}
  .tile .art{height:46px;border-radius:7px;margin-bottom:6px;}
  .tile .ln{height:5px;border-radius:3px;background:rgba(255,255,255,.12);margin-bottom:5px;width:80%;}
  .tile .pr{font-size:9px;font-weight:800;color:#6ee7b7;font-family:ui-monospace,Consolas,monospace;}
  .a1{background:linear-gradient(135deg,#ec4899,#8b5cf6);} .a2{background:linear-gradient(135deg,#22d3ee,#2563eb);} .a3{background:linear-gradient(135deg,#f97316,#ec4899);} .a4{background:linear-gradient(135deg,#10b981,#0891b2);}
  .code-body{padding:12px 16px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px;line-height:1.72;color:#cfd2e6;white-space:pre;}
  .code-body .k{color:#c4b5fd}.code-body .s{color:#6ee7b7}.code-body .m{color:#f472b6;font-weight:700}.code-body .c{color:#6b6f88}.code-body .n{color:#fbbf24}
  .live{position:absolute;top:6px;right:10px;display:flex;align-items:center;gap:6px;font-size:9px;font-weight:800;color:#6ee7b7;font-family:ui-monospace,Consolas,monospace;}
  .live::before{content:"";width:6px;height:6px;border-radius:50%;background:#10b981;box-shadow:0 0 8px #10b981;animation:twinkleDot 1.6s ease-in-out infinite;}

  .work-head{text-align:center;margin:56px 0 26px;}
  .work-head h3{font-size:clamp(20px,2.2vw,26px);font-weight:900;margin-top:10px;}
  .work-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;}
  .work{padding:28px 26px 24px;display:flex;flex-direction:column;gap:12px;overflow:hidden;transition:opacity .9s ease,transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s;}
  .work > *{position:relative;z-index:1;}
  .work::after{content:"";position:absolute;width:240px;height:240px;top:-130px;inset-inline-end:-90px;background:radial-gradient(circle,var(--glow),transparent 70%);opacity:.35;transition:opacity .45s;pointer-events:none;}
  .work:hover{transform:translateY(-6px);box-shadow:0 40px 80px -40px var(--glow);}
  .work:hover::after{opacity:.75;}
  .w-ic{width:52px;height:52px;border-radius:15px;display:flex;align-items:center;justify-content:center;background:var(--chip);box-shadow:0 12px 26px -12px var(--glow);margin-bottom:4px;}
  .w-ic svg{width:24px;height:24px;color:#fff;}
  .work h4{font-size:18px;font-weight:900;}
  .work p{font-size:13.5px;color:#a9adc4;line-height:1.9;flex:1;}
  .work.w1{--glow:rgba(236,72,153,.55);--chip:linear-gradient(135deg,#ec4899,#a855f7);}
  .work.w2{--glow:rgba(16,185,129,.55);--chip:linear-gradient(135deg,#10b981,#0891b2);}
  .work.w3{--glow:rgba(59,130,246,.55);--chip:linear-gradient(135deg,#3b82f6,#6366f1);}

  @media(max-width:1050px){
    .suite-grid{grid-template-columns:1fr;}
    .work-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  }
  @media(max-width:680px){
    .suite{padding:30px 20px;}
    .work-grid{grid-template-columns:1fr;}
    .prod-visual{height:220px;}
    .mock-win{top:18px;left:16px;right:16px;}
    .store-grid{grid-template-columns:repeat(3,1fr);}
    .store-grid .tile:nth-child(4){display:none;}
    .code-body{font-size:10px;}
  }

    .cur{display:flex;gap:3px;flex-shrink:0;}
  .cur span{font-size:8px;font-weight:800;padding:3px 5px;border-radius:5px;background:rgba(255,255,255,.06);color:#8b8fa8;}
  .cur span:first-child{background:#3b82f6;color:#fff;}
  .saas-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;}
  .avail{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:800;color:#6ee7b7;padding:6px 11px;border-radius:999px;background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.35);}
  .avail::before{content:"";width:7px;height:7px;border-radius:50%;background:#10b981;box-shadow:0 0 8px #10b981;animation:twinkleDot 1.6s ease-in-out infinite;}
  .saas h4{font-size:21px;font-weight:900;}
  .work-head .eyebrow{text-transform:none;letter-spacing:.06em;}
  .saas .kind{font-size:13px;font-weight:700;color:#c4b5fd;margin-top:-6px;}
  .saas-cta{display:inline-flex;align-items:center;gap:8px;margin-top:6px;padding-top:14px;border-top:1px solid var(--border);font-size:13px;font-weight:800;color:#e5e7f5;transition:color .25s;}
  .saas-cta svg{width:15px;height:15px;transition:transform .3s;}
  [dir=rtl] .saas-cta svg{transform:scaleX(-1);}
  .saas-cta:hover{color:var(--cyan);}
  .visit.ext svg{transform:none !important;}

  /* ============ CONTACT (premium) ============ */
  .contact-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:28px;align-items:stretch;}
  .glass{position:relative;border-radius:26px;background:linear-gradient(160deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,.015) 100%);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 40px 90px -50px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.07);}
  .glass::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(140deg,rgba(139,92,246,.6),rgba(255,255,255,.05) 38%,rgba(255,255,255,.05) 62%,rgba(34,211,238,.5));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;}
  .eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#c4b5fd;}
  .eyebrow::before{content:"";width:24px;height:2px;border-radius:2px;background:var(--grad);}

  .contact-info{padding:40px 36px;display:flex;flex-direction:column;gap:22px;overflow:hidden;}
  .contact-info::after{content:"";position:absolute;width:340px;height:340px;top:-150px;inset-inline-end:-130px;background:radial-gradient(circle,rgba(139,92,246,.32),transparent 65%);pointer-events:none;}
  .contact-info > *{position:relative;z-index:1;}
  .contact-info h3{font-size:clamp(24px,2.6vw,32px);font-weight:900;line-height:1.4;}
  .contact-info > p{color:#a9adc4;font-size:14.5px;line-height:1.95;}

  .mail-card{display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:18px;background:rgba(5,6,13,.55);border:1px solid var(--border);transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .35s,box-shadow .35s;}
  .mail-card:hover{transform:translateY(-3px);border-color:rgba(139,92,246,.55);box-shadow:0 18px 40px -18px rgba(139,92,246,.6);}
  .info-icon{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 10px 24px -10px rgba(59,130,246,.8);}
  .info-icon svg{width:21px;height:21px;color:#fff;}
  .mail-card .txt{flex:1;min-width:0;}
  .mail-card .txt span{display:block;font-size:12px;color:var(--muted);margin-bottom:4px;}
  .mail-card .txt b{display:block;font-size:16.5px;font-weight:800;overflow-wrap:anywhere;}
  .mail-card .go{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);color:#cfd2e6;transition:.3s;flex-shrink:0;}
  .mail-card:hover .go{background:var(--grad);border-color:transparent;color:#fff;}
  .mail-card .go svg{width:16px;height:16px;}
  .icon-blue{background:linear-gradient(135deg,#38bdf8,#2563eb);}
  .icon-pinkpurple{background:linear-gradient(135deg,#ec4899,#a855f7);}

  .perks{display:grid;gap:12px;margin-top:auto;padding-top:8px;}
  .perk{display:flex;align-items:center;gap:12px;font-size:13.5px;color:#cfd2e6;font-weight:600;}
  .perk i{width:30px;height:30px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.35);color:#6ee7b7;font-style:normal;flex-shrink:0;}
  .perk i.cy{background:rgba(34,211,238,.1);border-color:rgba(34,211,238,.35);color:#67e8f9;}
  .perk i svg{width:15px;height:15px;}

  .contact-form{padding:40px 36px;display:flex;flex-direction:column;gap:20px;}
  .form-title{font-size:21px;font-weight:900;}
  .form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
  .field label{display:block;font-size:13px;font-weight:700;margin-bottom:8px;color:#cfd2e6;}
  .field input,.field textarea{
    width:100%;padding:14px 16px;border-radius:14px;
    background:rgba(5,6,13,.55);border:1px solid var(--border);color:#fff;
    font-family:inherit;font-size:14px;transition:border-color .25s, box-shadow .25s, background .25s;
  }
  .field input::placeholder,.field textarea::placeholder{color:#6b6f88;}
  .field textarea{resize:vertical;min-height:140px;}
  .field input:focus,.field textarea:focus{outline:none;border-color:rgba(139,92,246,.8);background:rgba(139,92,246,.07);box-shadow:0 0 0 4px rgba(139,92,246,.15);}
  .submit-btn{
    position:relative;overflow:hidden;
    padding:16px;border-radius:14px;background:var(--grad);color:#fff;
    font-weight:800;font-size:15px;display:flex;align-items:center;justify-content:center;gap:10px;
    box-shadow:0 16px 36px -14px rgba(139,92,246,.8);transition:.3s;
  }
  .submit-btn::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);transition:left .7s ease;}
  .submit-btn:hover{transform:translateY(-2px);box-shadow:0 20px 40px -12px rgba(139,92,246,.9);}
  .submit-btn:hover::after{left:120%;}
  .submit-btn:disabled{opacity:.6;cursor:not-allowed;transform:none;}
  .form-msg{font-size:13.5px;font-weight:700;padding:10px 14px;border-radius:10px;display:none;}
  .form-msg.ok{display:block;color:#6ee7b7;background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.3);}
  .form-msg.err{display:block;color:#fca5a5;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);}

  .offices{margin-top:72px;}
  .offices-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:28px;flex-wrap:wrap;}
  .offices-head h3{font-size:clamp(24px,2.6vw,32px);font-weight:900;margin-top:10px;}
  .offices-head p{color:var(--muted);font-size:14.5px;max-width:420px;}
  .offices-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;}
  .office{padding:28px 26px 22px;display:flex;flex-direction:column;gap:12px;overflow:hidden;
    transition:opacity .9s ease, transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s;}
  .office > *{position:relative;z-index:1;}
  .office::after{content:"";position:absolute;width:240px;height:240px;bottom:-130px;inset-inline-start:-90px;background:radial-gradient(circle,var(--glow),transparent 70%);opacity:.35;transition:opacity .45s;pointer-events:none;}
  .office:hover{transform:translateY(-6px);box-shadow:0 40px 80px -40px var(--glow);}
  .office:hover::after{opacity:.75;}
  .office-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px;}
  .code{font-size:12px;font-weight:900;letter-spacing:.16em;padding:7px 12px;border-radius:10px;color:#fff;background:var(--chip);box-shadow:0 10px 22px -12px var(--glow);}
  .office-pin{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.05);border:1px solid var(--border);color:#e5e7f5;}
  .office-pin svg{width:18px;height:18px;}
  .office h4{font-size:20px;font-weight:900;}
  .office .city{font-size:13px;color:#c4b5fd;font-weight:700;}
  .office address{font-style:normal;font-size:13.5px;line-height:1.9;color:#a9adc4;flex:1;}
  .map-link{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:#e5e7f5;padding-top:14px;margin-top:4px;border-top:1px solid var(--border);transition:color .25s;}
  .map-link svg{width:15px;height:15px;transition:transform .3s;}
  .map-link:hover{color:var(--cyan);}
  .map-link:hover svg{transform:translate(2px,-2px);}
  .office.ksa{--glow:rgba(16,185,129,.55);--chip:linear-gradient(135deg,#10b981,#047857);}
  .office.egy{--glow:rgba(139,92,246,.55);--chip:linear-gradient(135deg,#8b5cf6,#4f46e5);}
  .office.uae{--glow:rgba(34,211,238,.5);--chip:linear-gradient(135deg,#22d3ee,#2563eb);}

  @media(max-width:1050px){
    .contact-wrap{grid-template-columns:1fr;}
    .offices-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  }
  @media(max-width:680px){
    .contact-info,.contact-form{padding:28px 22px;}
    .offices-grid{grid-template-columns:1fr;}
    .office{padding:24px 22px 20px;}
    .offices-head{align-items:flex-start;}
  }

  /* ============ FOOTER ============ */
  footer{
    padding:70px 6vw 30px;
    background:rgba(255,255,255,.015);
    border-top:1px solid var(--border);
  }
  .footer-grid{
    display:grid;grid-template-columns:1.3fr 1fr 1fr 1.3fr;gap:40px;
    padding-bottom:44px;border-bottom:1px solid var(--border);
  }
  .footer-col h4{font-size:15px;font-weight:800;margin-bottom:18px;}
  .footer-col ul li{margin-bottom:12px;font-size:13.5px;color:var(--muted);}
  .footer-brand .brand{margin-bottom:14px;}
  .footer-brand p{font-size:13.5px;color:var(--muted);line-height:1.8;}
  .footer-bottom{
    display:flex;align-items:center;justify-content:space-between;
    padding-top:24px;flex-wrap:wrap;gap:16px;
  }
  .footer-bottom p{font-size:13px;color:var(--muted);}
  .socials{display:flex;gap:12px;}
  .social-btn{
    width:38px;height:38px;border-radius:50%;
    border:1px solid var(--border);background:var(--card);
    display:flex;align-items:center;justify-content:center;
    transition:border-color .25s, box-shadow .25s;
  }
  .social-btn svg{width:16px;height:16px;color:#cfd2e6;transition:color .25s;}
  .social-btn.spin svg,.social-btn.spin{animation:spinOnce .65s cubic-bezier(.3,.1,.2,1);}
  @keyframes spinOnce{from{transform:rotate(0deg);}to{transform:rotate(720deg);}}
  .social-btn[data-brand="facebook"]:hover{border-color:#1877f2;box-shadow:0 0 16px -2px #1877f2;}
  .social-btn[data-brand="facebook"]:hover svg{color:#1877f2;}
  .social-btn[data-brand="instagram"]:hover{border-color:#e1306c;box-shadow:0 0 16px -2px #e1306c;}
  .social-btn[data-brand="instagram"]:hover svg{color:#e1306c;}
  .social-btn[data-brand="linkedin"]:hover{border-color:#0a66c2;box-shadow:0 0 16px -2px #0a66c2;}
  .social-btn[data-brand="linkedin"]:hover svg{color:#0a66c2;}
  .social-btn[data-brand="twitter"]:hover{border-color:#1da1f2;box-shadow:0 0 16px -2px #1da1f2;}
  .social-btn[data-brand="twitter"]:hover svg{color:#1da1f2;}
  .social-btn[data-brand="youtube"]:hover{border-color:#ff0000;box-shadow:0 0 16px -2px #ff0000;}
  .social-btn[data-brand="youtube"]:hover svg{color:#ff0000;}

  /* ============ RESPONSIVE ============ */
  @media(max-width:1050px){
    .services-grid{grid-template-columns:repeat(2,1fr);}
    .portfolio-grid{grid-template-columns:repeat(2,1fr);}
    .about-wrap{flex-direction:column;align-items:stretch;}
    .contact-wrap{flex-direction:column;align-items:stretch;}
    nav.menu{display:none;}
  }
  @media(max-width:680px){
    .hero{flex-direction:column;text-align:center;padding-top:40px;}
    .hero-text{max-width:100%;}
    .hero-text p{margin-inline:auto;}
    .hero-text h1{line-height:1.5;padding-top:6px;}
    .btn-row{justify-content:center;}
    .stats{justify-content:center;gap:30px;}
    .hero-visual{
      flex:none;
      width:290px;height:290px;
      max-width:82vw;max-height:82vw;
      margin:10px auto 0;
    }
    .services-grid{grid-template-columns:1fr;}
    .portfolio-grid{grid-template-columns:1fr;}
    .form-row{grid-template-columns:1fr;}
    .contact-form,.field input,.field textarea{width:100%;}
    .footer-grid{grid-template-columns:1fr 1fr;}
    .footer-bottom{flex-direction:column;align-items:center;text-align:center;}
    .socials{justify-content:center;}
  }

  /* hero responsive (premium) */
  @media(max-width:1050px){
    .hero{flex-direction:column;text-align:center;gap:44px;min-height:auto;}
    .hero-text{max-width:680px;}
    .hero-text p{margin-inline:auto;}
    .btn-row{justify-content:center;}
    .hero-visual{flex:none;width:440px;height:440px;max-width:84vw;max-height:84vw;margin:0 auto;}
    .h-chip.c1{right:-6%;}
    .h-chip.c2{left:-6%;}
  }
  @media(max-width:680px){
    .hero{gap:30px;}
    .hero-visual{flex:none;width:340px;height:340px;max-width:88vw;max-height:88vw;margin:10px auto 0;}
    .stats{gap:0;display:flex;justify-content:center;width:100%;}
    .stat{padding:0 16px;}
    .h-chip{padding:8px 10px;gap:8px;}
    .h-chip i{width:26px;height:26px;}
    .h-chip b{font-size:11px;} .h-chip small{font-size:10px;}
    .h-chip.c1{right:-2%;top:2%;} .h-chip.c2{left:-2%;bottom:8%;}
    .h-chip.c3{display:none;}
  }

    @media(prefers-reduced-motion:reduce){
    *{animation:none !important;transition:none !important;}
  }


  /* ============ ADMIN BAR ============ */
  .admin-bar header.navbar{top:46px;}
  @media(max-width:782px){ .admin-bar header.navbar{top:56px;} }

  /* ============ BLOG LIST ============ */
  .blog-hero{padding-top:165px;padding-bottom:20px;text-align:center;}
  .blog-hero h1{font-size:clamp(36px,4.8vw,58px);font-weight:900;margin-bottom:14px;line-height:1.3;}
  .blog-hero p{color:#a9adc4;font-size:16.5px;line-height:1.9;max-width:640px;margin:0 auto;}
  .cat-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:30px;}
  .cat-chips a{padding:9px 18px;border-radius:999px;font-size:13.5px;font-weight:700;color:#cfd2e6;background:rgba(255,255,255,.035);border:1px solid var(--border);transition:.25s;}
  .cat-chips a:hover,.cat-chips a.on{color:#fff;border-color:rgba(139,92,246,.55);background:rgba(139,92,246,.16);box-shadow:0 8px 22px -12px rgba(139,92,246,.8);}
  .blog-list{padding-top:40px;}
  .posts-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;}
  .post-card{display:flex;flex-direction:column;overflow:hidden;transition:opacity .9s ease, transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s;}
  .post-card:hover{transform:translateY(-6px);box-shadow:0 40px 80px -40px rgba(139,92,246,.6);}
  .pc-media{display:block;position:relative;aspect-ratio:16/9;overflow:hidden;background:#0b0d1c;}
  .pc-media img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease;}
  .post-card:hover .pc-media img{transform:scale(1.06);}
  .pc-ph{position:absolute;inset:0;background:radial-gradient(circle at 25% 20%,rgba(139,92,246,.6),transparent 55%),radial-gradient(circle at 80% 85%,rgba(34,211,238,.45),transparent 55%),#0b0d1c;}
  .pc-ph::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:28px 28px;}
  .pc-body{padding:22px 24px 24px;display:flex;flex-direction:column;gap:12px;flex:1;position:relative;z-index:1;}
  .pc-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);font-weight:600;}
  .pc-meta .cat{color:#c4b5fd;font-weight:800;}
  .pc-meta .dot{width:3px;height:3px;border-radius:50%;background:#555a78;}
  .post-card h2{font-size:19px;font-weight:900;line-height:1.6;}
  .post-card h2 a{transition:color .25s;}
  .post-card h2 a:hover{color:#c4b5fd;}
  .post-card p{font-size:14px;color:#a9adc4;line-height:1.9;flex:1;}
  .pc-more{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:800;color:#e5e7f5;padding-top:14px;border-top:1px solid var(--border);transition:color .25s;}
  .pc-more svg{width:15px;height:15px;}
  [dir=rtl] .pc-more svg{transform:scaleX(-1);}
  .pc-more:hover{color:var(--cyan);}
  .post-card.featured{grid-column:1/-1;flex-direction:row;}
  .post-card.featured{align-items:center;}
  .post-card.featured .pc-media{flex:1.25;aspect-ratio:16/9;min-height:0;}
  .post-card.featured .pc-media img{object-fit:cover;object-position:center;}
  .post-card.featured .pc-body{flex:1;padding:40px 38px;justify-content:center;gap:16px;}
  .post-card.featured h2{font-size:clamp(22px,2.4vw,30px);line-height:1.5;}
  .post-card.featured p{flex:none;font-size:15px;}
  .navigation.pagination{margin-top:48px;display:flex;justify-content:center;}
  .pagination .nav-links{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;}
  .pagination .page-numbers{min-width:44px;height:44px;padding:0 14px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;background:rgba(255,255,255,.035);border:1px solid var(--border);color:#cfd2e6;transition:.25s;}
  .pagination .page-numbers.current,.pagination a.page-numbers:hover{background:var(--grad);border-color:transparent;color:#fff;}
  .screen-reader-text{position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap;}
  .empty-state{padding:64px 30px;text-align:center;max-width:640px;margin:0 auto;}
  .empty-state h3{font-size:22px;font-weight:900;margin-bottom:10px;}
  .empty-state p{color:var(--muted);font-size:15px;}

  /* ============ BLOG DETAILS ============ */
  .ns-single{display:block;max-width:1160px;padding:160px 6vw 40px;}
  .single-head{max-width:840px;margin:0 auto 36px;text-align:center;}
  .back-link{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:800;color:#c4b5fd;margin-bottom:24px;padding:8px 14px;border-radius:999px;background:rgba(139,92,246,.08);border:1px solid rgba(139,92,246,.25);transition:.25s;}
  .back-link:hover{color:#fff;border-color:rgba(139,92,246,.6);}
  .back-link svg{width:15px;height:15px;transform:scaleX(-1);}
  [dir=rtl] .back-link svg{transform:none;}
  .single-head .pc-meta{justify-content:center;margin-bottom:18px;font-size:13.5px;}
  .single-head h1{font-size:clamp(28px,3.8vw,46px);font-weight:900;line-height:1.45;margin-bottom:24px;}
  .author{display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:700;color:#cfd2e6;}
  .author img{width:36px;height:36px;border-radius:50%;border:2px solid rgba(139,92,246,.5);}
  .single-cover{border-radius:26px;overflow:hidden;margin:0 0 48px;}
  .single-cover img{width:100%;height:auto;display:block;}
  .single-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:44px;align-items:start;}
  .single-side{display:flex;flex-direction:column;gap:16px;align-self:stretch;}
  .side-card{padding:24px;}
  .side-card h4{font-size:15.5px;font-weight:900;margin-bottom:14px;}
  .share{display:flex;gap:8px;flex-wrap:wrap;}
  .share a,.share button{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.04);border:1px solid var(--border);color:#cfd2e6;transition:.25s;}
  .share a:hover,.share button:hover{border-color:var(--cyan);color:var(--cyan);transform:translateY(-2px);}
  .share button.copied{border-color:#10b981;color:#6ee7b7;}
  .share svg{width:18px;height:18px;}
  .side-cta p{font-size:13.5px;color:#a9adc4;line-height:1.85;margin-bottom:16px;}
  .side-cta .nav-cta{display:flex;justify-content:center;}

  .prose{font-size:17px;line-height:2.05;color:#d4d7ea;overflow-wrap:break-word;}
  .prose > * + *{margin-top:1.15em;}
  .prose h2{font-size:clamp(22px,2.4vw,28px);font-weight:900;color:#fff;margin-top:1.9em;line-height:1.5;}
  .prose h3{font-size:21px;font-weight:800;color:#fff;margin-top:1.6em;line-height:1.55;}
  .prose h4{font-size:18px;font-weight:800;color:#fff;margin-top:1.4em;}
  .prose strong{color:#fff;}
  .prose a{color:#67e8f9;text-decoration:underline;text-decoration-color:rgba(103,232,249,.4);text-underline-offset:4px;}
  .prose ul,.prose ol{padding-inline-start:1.4em;}
  .prose ul{list-style:disc;} .prose ol{list-style:decimal;}
  .prose li{margin:.45em 0;}
  .prose li::marker{color:var(--purple);}
  .prose blockquote{padding:20px 26px;border-inline-start:3px solid var(--purple);background:rgba(139,92,246,.07);border-radius:16px;color:#e5e7f5;font-size:18px;}
  .prose blockquote p{margin:0;}
  .prose img{border-radius:18px;height:auto;}
  .prose figure{margin:1.8em 0;}
  .prose figcaption{font-size:13px;color:var(--muted);text-align:center;margin-top:10px;}
  .prose code{font-family:ui-monospace,Consolas,monospace;font-size:.88em;padding:2px 7px;border-radius:7px;background:rgba(255,255,255,.07);color:#f9a8d4;}
  .prose pre{direction:ltr;text-align:left;padding:20px 22px;border-radius:16px;background:#0b0d1c;border:1px solid var(--border);overflow:auto;font-size:14px;line-height:1.75;}
  .prose pre code{background:none;padding:0;color:#cfd2e6;font-size:inherit;}
  .prose table{width:100%;border-collapse:collapse;font-size:15px;}
  .prose th,.prose td{padding:11px 14px;border:1px solid var(--border);text-align:start;}
  .prose th{background:rgba(255,255,255,.04);color:#fff;}
  .prose hr{border:0;height:1px;background:var(--border);margin:2.4em 0;}
  .prose .wp-block-image img{width:100%;}
  .prose .alignwide,.prose .alignfull{width:100%;}
  .prose iframe,.prose video{max-width:100%;border-radius:16px;}
  .post-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:44px !important;}
  .post-tags a{font-size:12.5px;font-weight:700;padding:6px 13px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid var(--border);color:#cfd2e6;text-decoration:none;}
  .post-tags a:hover{border-color:var(--purple);color:#fff;}
  .post-nav{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:56px;}
  .post-nav a{display:block;padding:22px 24px;transition:transform .35s, box-shadow .35s;}
  .post-nav a:hover{transform:translateY(-4px);box-shadow:0 30px 60px -30px rgba(139,92,246,.6);}
  .post-nav small{display:block;font-size:12px;color:var(--muted);font-weight:700;margin-bottom:6px;}
  .post-nav b{font-size:15px;line-height:1.7;}
  .post-nav .next{text-align:end;}
  .related{padding:80px 0 0;}
  .related .sec-head{margin-bottom:34px;}
  .page-prose{max-width:840px;margin:0 auto;}

  @media(max-width:1050px){
    .posts-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
    .single-layout{grid-template-columns:1fr;}
    .single-side{position:static;}
  }
  @media(max-width:680px){
    .posts-grid{grid-template-columns:1fr;}
    .post-card.featured{flex-direction:column;}
    .post-card.featured .pc-media{min-height:0;aspect-ratio:16/9;}
    .post-card.featured .pc-body{padding:22px 24px 24px;}
    .blog-hero{padding-top:125px;}
    .ns-single{padding-top:120px;}
    .prose{font-size:16px;}
    .post-nav{grid-template-columns:1fr;}
  }


  /* ============ BREADCRUMBS ============ */
  .crumbs{display:inline-flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin-bottom:22px;padding:8px 16px;border-radius:999px;background:rgba(139,92,246,.08);border:1px solid rgba(139,92,246,.25);font-size:13px;font-weight:700;}
  .crumbs a{color:#c4b5fd;transition:color .25s;}
  .crumbs a:hover{color:#fff;}
  .crumbs .sep{color:#555a78;}


  /* ============ WIDE SCREENS ============ */
  @media(min-width:1600px){
    section{padding-left:96px;padding-right:96px;}
    .container{max-width:1400px;}
    .container.ns-single{max-width:1240px;padding-left:96px;padding-right:96px;}
    .nav-inner{max-width:1320px;}
    footer{padding-left:96px;padding-right:96px;}
    .footer-grid,.footer-bottom{max-width:1400px;margin-left:auto;margin-right:auto;}
  }
  @media(min-width:2200px){
    html{font-size:17px;}
    .container{max-width:1560px;}
    .nav-inner{max-width:1480px;}
    .footer-grid,.footer-bottom{max-width:1560px;}
    .container.ns-single{max-width:1320px;}
  }


  /* ============ SIDEBAR ADS ============ */
  .side-ads{position:sticky;top:110px;margin-top:4px;}
  .admin-bar .side-ads{top:142px;}
  .ads-track{position:relative;display:grid;}
  .ad-slide{grid-area:1/1;opacity:0;visibility:hidden;transform:translateY(10px) scale(.985);transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1), visibility .7s;}
  .ad-slide.on{opacity:1;visibility:visible;transform:none;}
  .ad-slide:only-child{opacity:1;visibility:visible;transform:none;}
  .ad-slide figure,.ad-slide .wp-block-image{margin:0;}
  .ad-slide a{display:block;border-radius:22px;overflow:hidden;position:relative;box-shadow:0 30px 60px -28px rgba(0,0,0,.9);border:1px solid rgba(255,255,255,.08);transition:transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s;}
  .ad-slide a::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.22) 50%,transparent 65%);transform:translateX(-120%);transition:transform .9s ease;pointer-events:none;}
  .ad-slide a:hover{transform:translateY(-4px);box-shadow:0 40px 70px -28px rgba(139,92,246,.55);}
  .ad-slide a:hover::after{transform:translateX(120%);}
  .ad-slide img{width:100%;height:auto;display:block;}
  .ads-dots{display:flex;justify-content:center;gap:7px;margin-top:14px;}
  .ads-dots button{width:8px;height:8px;border-radius:999px;background:rgba(255,255,255,.18);transition:width .35s, background .35s;padding:0;}
  .ads-dots button.on{width:24px;background:linear-gradient(90deg,var(--purple),var(--cyan));}
  @media(max-width:1050px){
    .side-ads{position:static;max-width:420px;width:100%;margin:8px auto 0;}
  }


  /* ============ PROSE — ICONS & TOUCHES ============ */
  .prose{counter-reset:nsh2;}
  .prose h2{display:flex;align-items:center;gap:14px;scroll-margin-top:110px;}
  .prose h2::before{counter-increment:nsh2;content:counter(nsh2,decimal-leading-zero);flex-shrink:0;width:44px;height:44px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;font-size:15px;font-weight:900;color:#fff;font-family:ui-monospace,Consolas,monospace;background:linear-gradient(135deg,var(--purple),var(--blue));box-shadow:0 10px 24px -10px rgba(139,92,246,.85);}
  .prose h3{padding-inline-start:14px;border-inline-start:3px solid var(--purple);line-height:1.6;}
  .prose ul{list-style:none;padding-inline-start:0;}
  .prose ul li{position:relative;padding-inline-start:36px;}
  .prose ul li::before{content:"";position:absolute;inset-inline-start:0;top:.5em;width:23px;height:23px;border-radius:50%;border:1px solid rgba(16,185,129,.45);background:rgba(16,185,129,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236ee7b7' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat;}
  .prose ul.is-style-ns-cross li::before{border-color:rgba(244,63,94,.45);background:rgba(244,63,94,.13) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fda4af' stroke-width='3.4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E") center/11px no-repeat;}
  .prose ul.is-style-ns-star li::before{border-color:rgba(251,191,36,.45);background:rgba(251,191,36,.13) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fcd34d'%3E%3Cpath d='m12 2 3 6.9 7.5.6-5.7 5 1.7 7.4L12 18l-6.5 3.9 1.7-7.4-5.7-5 7.5-.6Z'/%3E%3C/svg%3E") center/12px no-repeat;}
  .prose ol{list-style:none;counter-reset:nsol;padding-inline-start:0;}
  .prose ol li{counter-increment:nsol;position:relative;padding-inline-start:46px;}
  .prose ol li::before{content:counter(nsol);position:absolute;inset-inline-start:0;top:.3em;width:31px;height:31px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;color:#fff;background:linear-gradient(135deg,var(--purple),var(--cyan));box-shadow:0 8px 18px -8px rgba(139,92,246,.8);}
  .prose li::marker{content:"";}
  .prose blockquote{position:relative;padding-inline-start:74px;}
  .prose blockquote::before{content:"";position:absolute;inset-inline-start:22px;top:20px;width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,var(--purple),var(--pink)) ;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7.2 6C4.9 6 3 7.9 3 10.2V18h7v-7H6.1c0-1.4 1.1-2.5 2.5-2.5V6h-1.4Zm10 0c-2.3 0-4.2 1.9-4.2 4.2V18h7v-7h-3.9c0-1.4 1.1-2.5 2.5-2.5V6h-1.4Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7.2 6C4.9 6 3 7.9 3 10.2V18h7v-7H6.1c0-1.4 1.1-2.5 2.5-2.5V6h-1.4Zm10 0c-2.3 0-4.2 1.9-4.2 4.2V18h7v-7h-3.9c0-1.4 1.1-2.5 2.5-2.5V6h-1.4Z'/%3E%3C/svg%3E") center/contain no-repeat;}
  .prose .wp-block-table{overflow-x:auto;border-radius:18px;border:1px solid var(--border);background:rgba(255,255,255,.02);}
  .prose .wp-block-table table{border:0;}
  .prose .wp-block-table th,.prose .wp-block-table td{border:0;border-bottom:1px solid var(--border);}
  .prose .wp-block-table thead th{background:linear-gradient(90deg,rgba(139,92,246,.22),rgba(34,211,238,.14));color:#fff;font-weight:800;}
  .prose .wp-block-table tbody tr:hover td{background:rgba(255,255,255,.03);}
  .prose .wp-block-table tbody td:first-child{font-weight:800;color:#fff;}
  .prose pre{position:relative;padding-top:46px !important;}
  .prose pre::before{content:"";position:absolute;top:18px;left:20px;width:10px;height:10px;border-radius:50%;background:#ff5f57;box-shadow:16px 0 #febc2e,32px 0 #28c840;}
  .prose .wp-block-icon{margin-block:.4em;}

  .prose .is-style-ns-tip,.prose .is-style-ns-note,.prose .is-style-ns-warn,.prose .is-style-ns-example{position:relative;padding:18px 22px;padding-inline-start:66px;border-radius:18px;border:1px solid;font-size:16px;line-height:1.95;}
  .prose .is-style-ns-tip::before,.prose .is-style-ns-note::before,.prose .is-style-ns-warn::before,.prose .is-style-ns-example::before{position:absolute;inset-inline-start:18px;top:16px;width:34px;height:34px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:17px;line-height:1;}
  .prose .is-style-ns-tip{background:rgba(251,191,36,.07);border-color:rgba(251,191,36,.3);}
  .prose .is-style-ns-tip::before{content:"💡";background:rgba(251,191,36,.16);}
  .prose .is-style-ns-note{background:rgba(34,211,238,.06);border-color:rgba(34,211,238,.28);}
  .prose .is-style-ns-note::before{content:"ℹ️";background:rgba(34,211,238,.15);}
  .prose .is-style-ns-warn{background:rgba(244,63,94,.06);border-color:rgba(244,63,94,.3);}
  .prose .is-style-ns-warn::before{content:"⚠️";background:rgba(244,63,94,.14);}
  .prose .is-style-ns-example{background:rgba(139,92,246,.07);border-color:rgba(139,92,246,.32);}
  .prose .is-style-ns-example::before{content:"🧪";background:rgba(139,92,246,.18);}

  /* ---- Table of contents ---- */
  .ns-toc{border-radius:20px;border:1px solid rgba(139,92,246,.3);background:linear-gradient(160deg,rgba(139,92,246,.1),rgba(34,211,238,.04));padding:6px 8px;margin-bottom:2em !important;}
  .ns-toc summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:12px 14px;font-weight:900;color:#fff;font-size:16.5px;}
  .ns-toc summary::-webkit-details-marker{display:none;}
  .ns-toc summary .ico{width:34px;height:34px;border-radius:11px;display:flex;align-items:center;justify-content:center;background:rgba(139,92,246,.2);font-size:17px;}
  .ns-toc summary .cnt{margin-inline-start:auto;font-size:12px;font-weight:700;color:#c4b5fd;padding:4px 10px;border-radius:999px;background:rgba(139,92,246,.14);}
  .ns-toc summary::after{content:"";width:9px;height:9px;border-right:2px solid #c4b5fd;border-bottom:2px solid #c4b5fd;transform:rotate(45deg);transition:transform .3s;margin-inline-start:6px;}
  .ns-toc[open] summary::after{transform:rotate(-135deg);}
  .ns-toc ol{margin:0 !important;padding:4px 14px 14px !important;display:grid;gap:2px;}
  .ns-toc ol li{padding-inline-start:40px !important;margin:0 !important;}
  .ns-toc ol li::before{width:26px !important;height:26px !important;font-size:12px !important;border-radius:8px !important;top:.45em !important;}
  .ns-toc a{display:block;padding:6px 0;font-size:15px;font-weight:700;color:#d4d7ea !important;text-decoration:none !important;transition:color .25s;}
  .ns-toc a:hover{color:#67e8f9 !important;}


  /* ============ FOOTER EXTRAS ============ */
  .foot-links{display:inline-flex;gap:14px;margin-inline-start:14px;padding-inline-start:14px;border-inline-start:1px solid var(--border);}
  .foot-links a{color:var(--muted);transition:color .25s;}
  .foot-links a:hover{color:var(--cyan);}
  .social-btn[data-brand="tiktok"]:hover{color:#fff;border-color:#ff0050;}
  .social-btn[data-brand="whatsapp"]:hover{color:#25d366;border-color:#25d366;}
  a.more-pill{display:inline-flex;text-decoration:none;}
  @media(max-width:680px){ .foot-links{display:flex;justify-content:center;margin:8px 0 0;padding:0;border:0;} }
