{"id":921,"date":"2026-10-25T19:22:22","date_gmt":"2026-10-25T19:22:22","guid":{"rendered":"https:\/\/tarekseliman.com\/home\/"},"modified":"2026-10-29T23:49:01","modified_gmt":"2026-10-29T23:49:01","slug":"home","status":"publish","type":"page","link":"https:\/\/tarekseliman.com\/ar\/","title":{"rendered":"\u0637\u0627\u0631\u0642 \u0633\u0644\u064a\u0645\u0627\u0646"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"921\" class=\"elementor elementor-921 elementor-7\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-388d832 e-con-full e-flex e-con e-parent\" data-id=\"388d832\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f09fc3b elementor-widget elementor-widget-html\" data-id=\"f09fc3b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"ts-home-hero\" id=\"home\" dir=\"rtl\">\r\n<style>\r\n\/* \u0627\u0633\u062a\u062f\u0639\u0627\u0621 \u062e\u0637 IBM Plex Sans Arabic *\/\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap');\r\n\r\n.ts-home-hero{--ts-ink:#171421;--ts-muted:#777489;--ts-purple:#7955e8;--ts-border:rgba(94,74,150,.13);position:relative;isolation:isolate;width:100%;overflow:hidden;background:#f8f6ff;color:var(--ts-ink);font-family:'IBM Plex Sans Arabic',system-ui,sans-serif;box-sizing:border-box}\r\n.ts-home-hero *,.ts-home-hero *::before,.ts-home-hero *::after{box-sizing:border-box}\r\n.ts-home-hero a{text-decoration:none;color:inherit}\r\n.ts-home-hero img{max-width:100%;display:block}\r\n.ts-home-hero .ts-hero-container{width:min(1200px,calc(100% - 64px));margin-inline:auto}\r\n.ts-home-hero .ts-orb{position:absolute;border-radius:50%;filter:blur(120px);pointer-events:none;z-index:-1}\r\n.ts-home-hero .ts-orb-one{width:500px;height:500px;top:-100px;right:10%;background:rgba(180,154,255,.3)}\r\n.ts-home-hero .ts-orb-two{width:400px;height:400px;bottom:-50px;left:-100px;background:rgba(222,207,255,.25)}\r\n.ts-home-hero .ts-hero-main{display:grid;grid-template-columns:1fr .95fr;align-items:center;gap:clamp(25px,4vw,65px);min-height:600px;padding:clamp(40px,6vw,70px) 0 40px}\r\n.ts-home-hero .ts-hero-content{position:relative;z-index:5;min-width:0}\r\n.ts-home-hero .ts-eyebrow{display:inline-flex;align-items:center;gap:9px;padding:8px 14px;margin-bottom:22px;border:1px solid rgba(121,85,232,.13);border-radius:50px;background:rgba(255,255,255,.75);color:#5e5775;font-size:12px;font-weight:600}\r\n.ts-home-hero .ts-status-dot{width:7px;height:7px;border-radius:50%;background:#29b77a;box-shadow:0 0 0 4px rgba(41,183,122,.12)}\r\n.ts-home-hero .ts-heading{max-width:620px;margin:0 0 20px;font-family:'IBM Plex Sans Arabic',sans-serif;font-size:clamp(42px,5.2vw,70px);font-weight:700;line-height:1.2;letter-spacing:0}\r\n.ts-home-hero .ts-heading .ts-gradient-text{background:linear-gradient(110deg,#7752e5 10%,#a68af7 60%,#8b61e8 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-style:normal}\r\n.ts-home-hero .ts-description{max-width:440px;margin:0 0 25px;color:var(--ts-muted);font-size:15px;line-height:1.8}\r\n.ts-home-hero .ts-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:28px}\r\n.ts-home-hero .ts-button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:44px;padding:0 20px;border-radius:50px;font-size:13px;font-weight:600;transition:transform .25s ease,box-shadow .25s ease;font-family:'IBM Plex Sans Arabic',sans-serif}\r\n.ts-home-hero .ts-button-primary{color:#fff!important;background:linear-gradient(110deg,#7046df,#9874f6);box-shadow:0 8px 20px rgba(121,85,232,.22)}\r\n.ts-home-hero .ts-button-secondary{color:var(--ts-ink)!important;background:rgba(255,255,255,.72);border:1px solid var(--ts-border)}\r\n.ts-home-hero .ts-button:hover{transform:translateY(-2px)}\r\n.ts-home-hero .ts-button-primary:hover{box-shadow:0 12px 25px rgba(121,85,232,.3)}\r\n.ts-home-hero .ts-button-secondary:hover{border-color:var(--ts-purple)}\r\n.ts-home-hero .ts-visual{position:relative;width:100%;max-width:600px;margin-inline:auto;perspective:1200px}\r\n.ts-home-hero .ts-visual-stage{position:relative;min-height:550px;display:flex;align-items:flex-end;justify-content:center;isolation:isolate}\r\n.ts-home-hero .ts-network-svg{position:absolute;inset:-15% -20%;width:140%;height:140%;z-index:0;pointer-events:none}\r\n.ts-home-hero .ts-network-svg .node{filter:drop-shadow(0 0 6px #7955e8)}\r\n.ts-home-hero .ts-shard{position:absolute;background:linear-gradient(135deg,rgba(255,255,255,.8),rgba(200,180,255,.2));border:1px solid rgba(255,255,255,.9);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);box-shadow:0 20px 40px rgba(121,85,232,.1),inset 0 0 20px rgba(255,255,255,.8);z-index:1}\r\n.ts-home-hero .ts-shard-1{width:120px;height:200px;top:25%;right:0;transform:rotate(-25deg) skewY(15deg);border-radius:20px} \/* \u062a\u0639\u062f\u064a\u0644 RTL *\/\r\n.ts-home-hero .ts-shard-2{width:80px;height:140px;top:50%;right:10%;transform:rotate(15deg) skewY(-10deg);border-radius:15px;opacity:.7} \/* \u062a\u0639\u062f\u064a\u0644 RTL *\/\r\n.ts-home-hero .ts-sphere{position:absolute;border-radius:50%;background:radial-gradient(circle at 30% 30%,#fff,#b49aff 40%,#7955e8 100%);box-shadow:0 10px 20px rgba(121,85,232,.4),inset -5px -5px 15px rgba(0,0,0,.2);z-index:3}\r\n.ts-home-hero .ts-sphere-1{width:30px;height:30px;bottom:25%;left:15%} \/* \u062a\u0639\u062f\u064a\u0644 RTL *\/\r\n.ts-home-hero .ts-sphere-2{width:18px;height:18px;bottom:35%;right:20%;opacity:.8} \/* \u062a\u0639\u062f\u064a\u0644 RTL *\/\r\n.ts-home-hero .ts-bg-icons{position:absolute;top:2%;left:2%;display:flex;gap:12px;z-index:2} \/* \u062a\u0639\u062f\u064a\u0644 RTL *\/\r\n.ts-home-hero .ts-bg-icon{width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(255,255,255,.5));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #fff;display:grid;place-items:center;box-shadow:0 8px 20px rgba(121,85,232,.08),inset 0 0 10px rgba(255,255,255,1)}\r\n.ts-home-hero .ts-bg-icon img{width:24px;height:24px;object-fit:contain}\r\n.ts-home-hero .ts-portrait{position:relative;z-index:2;width:95%;max-width:460px;margin-bottom:-15px;transform-style:preserve-3d;transition:transform .3s cubic-bezier(.2,.8,.2,1);-webkit-mask-image:linear-gradient(to bottom,black 80%,transparent 100%);mask-image:linear-gradient(to bottom,black 80%,transparent 100%)}\r\n.ts-home-hero .ts-portrait img{width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 25px 35px rgba(60,40,120,.25))}\r\n.ts-home-hero .ts-glow-mist{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:100%;height:120px;background:radial-gradient(ellipse at bottom,rgba(255,255,255,.7) 10%,rgba(245,240,255,.3) 40%,transparent 70%);z-index:4;pointer-events:none}\r\n.ts-home-hero .ts-float-card{position:absolute;z-index:5;display:flex;align-items:center;gap:16px;padding:16px 16px 16px 24px;border:1px solid rgba(255,255,255,.9);border-radius:24px;background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.3));-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 20px 40px rgba(100,80,180,.12),inset 0 0 15px rgba(255,255,255,1);animation:ts-float 7s ease-in-out infinite} \/* \u062a\u0639\u062f\u064a\u0644 RTL \u0644\u0644\u0628\u0627\u062f\u064a\u0646\u062c *\/\r\n.ts-home-hero .ts-float-projects{top:18%;right:-10%} \/* \u062a\u0639\u062f\u064a\u0644 RTL *\/\r\n.ts-home-hero .ts-float-clients{top:38%;left:-12%;animation-delay:-2.5s} \/* \u062a\u0639\u062f\u064a\u0644 RTL *\/\r\n.ts-home-hero .ts-float-years{bottom:22%;right:-8%;animation-delay:-4.5s} \/* \u062a\u0639\u062f\u064a\u0644 RTL *\/\r\n.ts-home-hero .ts-float-icon{display:grid;place-items:center;width:52px;height:52px;flex-shrink:0;border-radius:50%;background:#f4efff;color:var(--ts-purple);box-shadow:0 4px 15px rgba(121,85,232,.15)}\r\n.ts-home-hero .ts-float-icon svg{width:24px;height:24px;stroke-width:1.8}\r\n.ts-home-hero .ts-float-number{display:block;color:var(--ts-purple);font-family:'IBM Plex Sans Arabic',sans-serif;font-size:26px;font-weight:700;line-height:1;direction:ltr;text-align:right} \/* \u0644\u0636\u0645\u0627\u0646 \u0638\u0647\u0648\u0631 \u0627\u0644\u0623\u0631\u0642\u0627\u0645 \u0635\u062d *\/\r\n.ts-home-hero .ts-float-label{display:block;margin-top:4px;color:#666375;font-size:12px;font-weight:500;white-space:nowrap}\r\n@keyframes ts-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}\r\n.ts-home-hero .ts-signature{position:absolute;left:-5%;bottom:18%;z-index:6;transform:rotate(10deg)} \/* \u062a\u0639\u062f\u064a\u0644 RTL *\/\r\n.ts-home-hero .ts-signature img{width:200px;height:auto;display:block;filter:drop-shadow(0 2px 12px rgba(255,255,255,.95))}\r\n.ts-home-hero .ts-founder-row{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:34px}\r\n.ts-home-hero .ts-founder-label{color:#777188;font-size:11px;font-weight:700;letter-spacing:0;text-transform:uppercase}\r\n.ts-home-hero .ts-founder-card{display:inline-flex;align-items:center;gap:9px;padding:7px 12px;border:1px solid rgba(94,74,150,.1);border-radius:12px;background:rgba(255,255,255,.72);transition:transform .25s ease,border-color .25s ease}\r\n.ts-home-hero .ts-founder-card:hover{transform:translateY(-2px);border-color:rgba(121,85,232,.4)}\r\n.ts-home-hero .ts-founder-card img{width:24px;height:24px;object-fit:contain}\r\n.ts-home-hero .ts-founder-card strong{display:block;font-size:12px;line-height:1.3}\r\n.ts-home-hero .ts-founder-card small{display:block;color:var(--ts-muted);font-size:10px}\r\n.ts-home-hero .ts-tech-rail{position:relative;width:100%;overflow:hidden;border-block:1px solid rgba(94,74,150,.09);background:rgba(255,255,255,.65)}\r\n.ts-home-hero .ts-tech-track{display:flex;width:max-content;animation:ts-marquee 32s linear infinite}\r\n.ts-home-hero .ts-tech-rail:hover .ts-tech-track{animation-play-state:paused}\r\n.ts-home-hero .ts-tech-group{display:flex;align-items:center;gap:35px;padding:15px 18px;margin:0;list-style:none}\r\n.ts-home-hero .ts-tech-group li{display:flex;align-items:center;gap:10px;color:#514b66;font-size:12px;font-weight:600;letter-spacing:0;white-space:nowrap}\r\n.ts-home-hero .ts-tech-group li::before{content:\"\u2726\";color:var(--ts-purple);font-size:12px}\r\n@keyframes ts-marquee{to{transform:translateX(50%)}} \/* \u062a\u0645 \u0639\u0643\u0633 \u0627\u062a\u062c\u0627\u0647 \u0627\u0644\u0645\u0627\u0631\u0643\u064a \u0644\u0644\u0640 RTL *\/\r\n\r\n@media (max-width:1024px){\r\n.ts-home-hero .ts-hero-container{width:calc(100% - 48px)}\r\n.ts-home-hero .ts-hero-main{grid-template-columns:1fr .85fr;gap:20px}\r\n.ts-home-hero .ts-visual-stage{min-height:480px}\r\n.ts-home-hero .ts-float-projects{right:-5%}\r\n.ts-home-hero .ts-float-clients{left:-5%}\r\n.ts-home-hero .ts-float-years{right:-5%}\r\n.ts-home-hero .ts-signature{left:0;bottom:10%}\r\n.ts-home-hero .ts-signature img{width:150px}\r\n}\r\n@media (max-width:767px){\r\n.ts-home-hero .ts-hero-container{width:calc(100% - 32px)}\r\n.ts-home-hero .ts-hero-main{grid-template-columns:1fr;gap:30px;padding-top:100px} \/* \u0632\u064a\u0627\u062f\u0629 \u0627\u0644\u0628\u0627\u062f\u064a\u0646\u062c \u0644\u0644\u0645\u0648\u0628\u0627\u064a\u0644 \u0639\u0634\u0627\u0646 \u0627\u0644\u0647\u064a\u062f\u0631 *\/\r\n.ts-home-hero .ts-visual{max-width:420px}\r\n.ts-home-hero .ts-visual-stage{min-height:400px}\r\n.ts-home-hero .ts-float-projects{top:5%;right:-2%}\r\n.ts-home-hero .ts-float-clients{top:40%;left:-2%}\r\n.ts-home-hero .ts-float-years{bottom:15%;right:-2%}\r\n.ts-home-hero .ts-float-card{padding:10px 10px 10px 14px;gap:10px;border-radius:16px}\r\n.ts-home-hero .ts-float-icon{width:36px;height:36px}\r\n.ts-home-hero .ts-float-icon svg{width:18px;height:18px}\r\n.ts-home-hero .ts-float-number{font-size:18px}\r\n.ts-home-hero .ts-float-label{font-size:10px}\r\n.ts-home-hero .ts-shard-1,.ts-home-hero .ts-shard-2{display:none}\r\n}\r\n<\/style>\r\n\r\n<div class=\"ts-orb ts-orb-one\"><\/div>\r\n<div class=\"ts-orb ts-orb-two\"><\/div>\r\n\r\n<div class=\"ts-hero-container\">\r\n<div class=\"ts-hero-main\">\r\n<div class=\"ts-hero-content\">\r\n<div class=\"ts-eyebrow\"><span class=\"ts-status-dot\"><\/span>\u062e\u0628\u064a\u0631 \u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633 \u0648\u0634\u0648\u0628\u064a\u0641\u0627\u064a<\/div>\r\n<h1 class=\"ts-heading\">\u0637\u0627\u0631\u0642 \u0633\u0644\u064a\u0645\u0627\u0646.<br>\u0628\u0628\u0646\u064a \u0623\u0646\u0638\u0645\u0629<br><span class=\"ts-gradient-text\">\u0631\u0642\u0645\u064a\u0629.<\/span><\/h1>\r\n<p class=\"ts-description\">\u0623\u0646\u0627 \u0645\u0637\u0648\u0631 \u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633 \u0648\u0634\u0648\u0628\u064a\u0641\u0627\u064a \u062e\u0628\u0631\u062a\u064a \u0623\u0643\u062a\u0631 \u0645\u0646 11 \u0633\u0646\u0629\u060c \u0628\u0633\u0627\u0639\u062f \u0627\u0644\u0634\u0631\u0643\u0627\u062a \u062a\u0639\u0645\u0644 \u0645\u0648\u0627\u0642\u0639 \u0648\u0645\u062a\u0627\u062c\u0631 \u0625\u0644\u0643\u062a\u0631\u0648\u0646\u064a\u0629 \u0633\u0631\u064a\u0639\u0629\u060c \u0645\u062a\u0623\u0645\u0646\u0629 \u0635\u062d\u060c \u0648\u0645\u0633\u062a\u0639\u062f\u0629 \u062a\u0643\u0628\u0631 \u0645\u0639\u0627\u0647\u0645.<\/p>\r\n<div class=\"ts-actions\">\r\n<a class=\"ts-button ts-button-primary\" href=\"https:\/\/tarekseliman.com\/projects\/\">\u0634\u0648\u0641 \u0623\u0639\u0645\u0627\u0644\u064a <span>\u2190<\/span><\/a>\r\n<a class=\"ts-button ts-button-secondary\" href=\"https:\/\/tarekseliman.com\/contact\/\">\u064a\u0644\u0627 \u0646\u062a\u0643\u0644\u0645 <span>\u2196<\/span><\/a>\r\n<\/div>\r\n<div class=\"ts-founder-row\">\r\n<span class=\"ts-founder-label\">\u0645\u0624\u0633\u0633<\/span>\r\n<a class=\"ts-founder-card\" href=\"https:\/\/tarekseliman.com\/wp-mattab\/\">\r\n<img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Untitled-design-58.png\" alt=\"WP Mattab\" width=\"24\" height=\"24\" loading=\"lazy\">\r\n<span><strong>WP Mattab<\/strong><small>\u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633 \u0648\u0641\u0631\u064a\u0644\u0627\u0646\u0633<\/small><\/span>\r\n<\/a>\r\n<a class=\"ts-founder-card\" href=\"https:\/\/tarekseliman.com\/ravenx\/\">\r\n<img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/logo-small.png\" alt=\"Raven X\" width=\"24\" height=\"24\" loading=\"lazy\">\r\n<span><strong>Raven X<\/strong><small>\u0645\u0648\u0627\u0642\u0639 \u0648\u0623\u0646\u0638\u0645\u0629 \u0631\u0642\u0645\u064a\u0629<\/small><\/span>\r\n<\/a>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"ts-visual\">\r\n<div class=\"ts-visual-stage\">\r\n<svg class=\"ts-network-svg\" viewBox=\"0 0 800 800\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n<path d=\"M100 200 L 400 100 L 700 250 L 600 600 L 300 700 L 80 500 Z\" stroke=\"#7955e8\" stroke-opacity=\"0.15\" stroke-width=\"1.5\"\/>\r\n<path d=\"M400 100 L 600 600\" stroke=\"#7955e8\" stroke-opacity=\"0.15\" stroke-width=\"1.5\"\/>\r\n<path d=\"M700 250 L 80 500\" stroke=\"#7955e8\" stroke-opacity=\"0.15\" stroke-width=\"1.5\"\/>\r\n<path d=\"M100 200 L 300 700\" stroke=\"#7955e8\" stroke-opacity=\"0.1\" stroke-width=\"1\"\/>\r\n<circle cx=\"100\" cy=\"200\" r=\"6\" fill=\"#7955e8\" class=\"node\"\/>\r\n<circle cx=\"400\" cy=\"100\" r=\"8\" fill=\"#7955e8\" class=\"node\"\/>\r\n<circle cx=\"700\" cy=\"250\" r=\"5\" fill=\"#7955e8\" class=\"node\"\/>\r\n<circle cx=\"600\" cy=\"600\" r=\"7\" fill=\"#7955e8\" class=\"node\"\/>\r\n<circle cx=\"300\" cy=\"700\" r=\"5\" fill=\"#7955e8\" class=\"node\"\/>\r\n<circle cx=\"80\" cy=\"500\" r=\"6\" fill=\"#7955e8\" class=\"node\"\/>\r\n<\/svg>\r\n\r\n<div class=\"ts-shard ts-shard-1\"><\/div>\r\n<div class=\"ts-shard ts-shard-2\"><\/div>\r\n<div class=\"ts-sphere ts-sphere-1\"><\/div>\r\n<div class=\"ts-sphere ts-sphere-2\"><\/div>\r\n\r\n<div class=\"ts-bg-icons\">\r\n<div class=\"ts-bg-icon\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/174881.png\" alt=\"WordPress\" width=\"24\" height=\"24\" loading=\"lazy\"><\/div>\r\n<div class=\"ts-bg-icon\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/5968919.png\" alt=\"Shopify\" width=\"24\" height=\"24\" loading=\"lazy\"><\/div>\r\n<\/div>\r\n\r\n<div class=\"ts-portrait\" id=\"tsHeroPortrait\">\r\n<img decoding=\"async\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Untitled-design-34.png\" alt=\"\u0637\u0627\u0631\u0642 \u0633\u0644\u064a\u0645\u0627\u0646\" fetchpriority=\"high\">\r\n<\/div>\r\n\r\n<div class=\"ts-glow-mist\"><\/div>\r\n\r\n<div class=\"ts-float-card ts-float-projects\">\r\n<span class=\"ts-float-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"10\"><\/circle><line x1=\"2\" y1=\"12\" x2=\"22\" y2=\"12\"><\/line><path d=\"M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z\"><\/path><\/svg><\/span>\r\n<span><strong class=\"ts-float-number\">+220<\/strong><small class=\"ts-float-label\">\u0645\u0648\u0642\u0639<\/small><\/span>\r\n<\/div>\r\n\r\n<div class=\"ts-float-card ts-float-clients\">\r\n<span class=\"ts-float-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2\"><\/path><circle cx=\"9\" cy=\"7\" r=\"4\"><\/circle><path d=\"M23 21v-2a4 4 0 0 0-3-3.87\"><\/path><path d=\"M16 3.13a4 4 0 0 1 0 7.75\"><\/path><\/svg><\/span>\r\n<span><strong class=\"ts-float-number\">+120<\/strong><small class=\"ts-float-label\">\u0639\u0645\u064a\u0644<\/small><\/span>\r\n<\/div>\r\n\r\n<div class=\"ts-float-card ts-float-years\">\r\n<span class=\"ts-float-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"><\/rect><line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\"><\/line><line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\"><\/line><line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\"><\/line><path d=\"M8 14h.01M12 14h.01M16 14h.01M8 18h.01M12 18h.01M16 18h.01\"><\/path><\/svg><\/span>\r\n<span><strong class=\"ts-float-number\">+11<\/strong><small class=\"ts-float-label\">\u0633\u0646\u0629<\/small><\/span>\r\n<\/div>\r\n\r\n<div class=\"ts-signature\"><img decoding=\"async\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Untitled-design-59.png\" alt=\"\u062a\u0648\u0642\u064a\u0639 \u0637\u0627\u0631\u0642 \u0633\u0644\u064a\u0645\u0627\u0646\" loading=\"lazy\"><\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"ts-tech-rail\" aria-label=\"\u0627\u0644\u062e\u0628\u0631\u0627\u062a \u0627\u0644\u062a\u0642\u0646\u064a\u0629\">\r\n<div class=\"ts-tech-track\">\r\n<ul class=\"ts-tech-group\">\r\n<li>\u062a\u0637\u0648\u064a\u0631 \u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633<\/li><li>\u0648\u0648\u0643\u0648\u0645\u0631\u0633<\/li><li>\u0634\u0648\u0628\u064a\u0641\u0627\u064a \u0644\u064a\u0643\u0648\u064a\u062f<\/li><li>\u0628\u0631\u0645\u062c\u0629 PHP<\/li><li>\u0631\u0628\u0637 API<\/li><li>\u0628\u0648\u0627\u0628\u0627\u062a \u0627\u0644\u062f\u0641\u0639<\/li><li>\u062d\u0645\u0627\u064a\u0629 \u0643\u0644\u0627\u0648\u062f\u0641\u0644\u064a\u0631<\/li><li>\u0625\u062f\u0627\u0631\u0629 \u0633\u064a\u0631\u0641\u0631\u0627\u062a \u0648\u0644\u064a\u0646\u0643\u0633<\/li><li>\u062a\u0633\u0631\u064a\u0639 \u0627\u0644\u0645\u0648\u0627\u0642\u0639<\/li>\r\n<\/ul>\r\n<ul class=\"ts-tech-group\" aria-hidden=\"true\">\r\n<li>\u062a\u0637\u0648\u064a\u0631 \u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633<\/li><li>\u0648\u0648\u0643\u0648\u0645\u0631\u0633<\/li><li>\u0634\u0648\u0628\u064a\u0641\u0627\u064a \u0644\u064a\u0643\u0648\u064a\u062f<\/li><li>\u0628\u0631\u0645\u062c\u0629 PHP<\/li><li>\u0631\u0628\u0637 API<\/li><li>\u0628\u0648\u0627\u0628\u0627\u062a \u0627\u0644\u062f\u0641\u0639<\/li><li>\u062d\u0645\u0627\u064a\u0629 \u0643\u0644\u0627\u0648\u062f\u0641\u0644\u064a\u0631<\/li><li>\u0625\u062f\u0627\u0631\u0629 \u0633\u064a\u0631\u0641\u0631\u0627\u062a \u0648\u0644\u064a\u0646\u0643\u0633<\/li><li>\u062a\u0633\u0631\u064a\u0639 \u0627\u0644\u0645\u0648\u0627\u0642\u0639<\/li>\r\n<\/ul>\r\n<\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function(){\"use strict\";var p=document.getElementById(\"tsHeroPortrait\"),v=document.querySelector(\".ts-visual\");if(p&&v&&window.matchMedia(\"(hover: hover) and (pointer: fine)\").matches){v.addEventListener(\"mousemove\",function(e){var r=v.getBoundingClientRect(),x=(e.clientX-r.left)\/r.width,y=(e.clientY-r.top)\/r.height;p.style.transform=\"rotateX(\"+((0.5-y)*4)+\"deg) rotateY(\"+((x-0.5)*4)+\"deg)\"});v.addEventListener(\"mouseleave\",function(){p.style.transform=\"rotateX(0deg) rotateY(0deg)\"})}})();\r\n<\/script>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-655e1d1 e-con-full e-flex e-con e-parent\" data-id=\"655e1d1\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9590068 elementor-widget elementor-widget-html\" data-id=\"9590068\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"ts-case-studies\" id=\"case-studies\" dir=\"rtl\">\r\n<style>\r\n    \/* ==========================================================================\r\n       1. CSS RESET & VARIABLES\r\n       ========================================================================== *\/\r\n    \/* \u0627\u0633\u062a\u062f\u0639\u0627\u0621 \u062e\u0637 IBM Plex Sans Arabic \u0643\u062e\u0637 \u0623\u0633\u0627\u0633\u064a *\/\r\n    @import url('https:\/\/fonts.googleapis.com\/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap');\r\n\r\n    .ts-case-studies {\r\n        --ts-purple: #7955e8;\r\n        --ts-purple-light: #9b88ed;\r\n        --ts-ink: #171421;\r\n        --ts-muted: #666375;\r\n        --ts-bg: #faf9fc;\r\n        --ts-border: rgba(121, 85, 232, 0.1);\r\n        \r\n        font-family: 'IBM Plex Sans Arabic', system-ui, sans-serif;\r\n        background-color: var(--ts-bg);\r\n        padding: 80px 0;\r\n        color: var(--ts-ink);\r\n        overflow: hidden;\r\n    }\r\n\r\n    .ts-case-studies * { box-sizing: border-box; margin: 0; padding: 0; }\r\n    .ts-case-studies a { text-decoration: none; color: inherit; }\r\n    \r\n    .ts-container {\r\n        width: min(1300px, calc(100% - 48px));\r\n        margin-inline: auto;\r\n    }\r\n\r\n    \/* ==========================================================================\r\n       2. HEADER SECTION\r\n       ========================================================================== *\/\r\n    .ts-header {\r\n        display: flex;\r\n        justify-content: space-between;\r\n        align-items: flex-end;\r\n        margin-bottom: 40px;\r\n        flex-wrap: wrap;\r\n        gap: 20px;\r\n    }\r\n\r\n    .ts-header-content { max-width: 500px; }\r\n\r\n    .ts-kicker {\r\n        font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n        font-size: 13px;\r\n        font-weight: 700;\r\n        letter-spacing: 0.05em;\r\n        color: var(--ts-purple);\r\n        margin-bottom: 12px;\r\n        display: block;\r\n    }\r\n\r\n    .ts-title {\r\n        font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n        font-size: clamp(2.2rem, 4vw, 3.5rem);\r\n        font-weight: 700;\r\n        line-height: 1.2;\r\n        margin-bottom: 15px;\r\n    }\r\n\r\n    .ts-title em {\r\n        font-style: normal;\r\n        background: linear-gradient(135deg, #7955e8 10%, #a888ff 60%, #c49eff 100%);\r\n        -webkit-background-clip: text;\r\n        background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n    }\r\n\r\n    .ts-desc {\r\n        font-size: 15px;\r\n        color: var(--ts-muted);\r\n        line-height: 1.6;\r\n        margin-bottom: 20px;\r\n    }\r\n\r\n    .ts-link {\r\n        font-size: 14px;\r\n        font-weight: 600;\r\n        color: var(--ts-purple);\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 8px;\r\n        transition: gap 0.3s ease;\r\n    }\r\n\r\n    .ts-link:hover { gap: 12px; }\r\n\r\n    \/* Navigation Controls *\/\r\n    .ts-controls { display: flex; gap: 10px; direction: ltr; } \/* LTR \u0644\u0644\u062d\u0641\u0627\u0638 \u0639\u0644\u0649 \u062a\u0631\u062a\u064a\u0628 \u0627\u0644\u0623\u0632\u0631\u0627\u0631 *\/\r\n\r\n    .ts-nav-btn {\r\n        width: 48px;\r\n        height: 48px;\r\n        border-radius: 50%;\r\n        background: #fff;\r\n        border: 1px solid var(--ts-border);\r\n        display: grid;\r\n        place-items: center;\r\n        cursor: pointer;\r\n        transition: all 0.3s ease;\r\n        color: var(--ts-ink);\r\n    }\r\n\r\n    .ts-nav-btn:hover {\r\n        border-color: var(--ts-purple);\r\n        color: var(--ts-purple);\r\n        box-shadow: 0 4px 15px rgba(121, 85, 232, 0.1);\r\n    }\r\n    .ts-nav-btn svg { width: 20px; height: 20px; }\r\n\r\n    \/* ==========================================================================\r\n       3. DESKTOP GRID (Hidden on Mobile)\r\n       ========================================================================== *\/\r\n    .ts-grid {\r\n        display: grid;\r\n        grid-template-columns: 1.3fr 0.9fr;\r\n        gap: 24px;\r\n        align-items: stretch;\r\n    }\r\n\r\n    \/* FEATURED CARD (LEFT) *\/\r\n    .ts-featured-card {\r\n        position: relative;\r\n        background: linear-gradient(135deg, #f3efff 0%, #e5dbff 100%);\r\n        border-radius: 24px;\r\n        padding: 40px;\r\n        display: flex;\r\n        align-items: center;\r\n        overflow: hidden;\r\n        min-height: 480px;\r\n        border: 1px solid rgba(255, 255, 255, 0.5);\r\n    }\r\n\r\n    .ts-featured-card::before {\r\n        content: '';\r\n        position: absolute;\r\n        inset: 0;\r\n        background-image: \r\n            linear-gradient(rgba(121, 85, 232, 0.05) 1px, transparent 1px),\r\n            linear-gradient(90deg, rgba(121, 85, 232, 0.05) 1px, transparent 1px);\r\n        background-size: 30px 30px;\r\n        z-index: 0;\r\n    }\r\n\r\n    .ts-feat-content { position: relative; z-index: 2; width: 50%; }\r\n\r\n    .ts-badge {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 6px;\r\n        background: var(--ts-purple);\r\n        color: #fff;\r\n        font-size: 12px;\r\n        font-weight: 600;\r\n        padding: 6px 14px;\r\n        border-radius: 50px;\r\n        margin-bottom: 24px;\r\n    }\r\n\r\n    .ts-feat-title {\r\n        font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n        font-size: 32px;\r\n        font-weight: 700;\r\n        margin-bottom: 12px;\r\n        color: var(--ts-ink);\r\n    }\r\n\r\n    .ts-feat-tags {\r\n        font-size: 13px;\r\n        color: var(--ts-purple);\r\n        font-weight: 600;\r\n        margin-bottom: 16px;\r\n        display: flex;\r\n        align-items: center;\r\n        flex-wrap: wrap;\r\n        gap: 8px;\r\n    }\r\n    \r\n    .ts-feat-tags span { color: var(--ts-muted); font-weight: 400; }\r\n\r\n    .ts-feat-desc {\r\n        font-size: 14px;\r\n        color: var(--ts-muted);\r\n        line-height: 1.6;\r\n        margin-bottom: 30px;\r\n    }\r\n\r\n    .ts-feat-image {\r\n        position: absolute;\r\n        left: -5%; \/* \u062a\u0639\u062f\u064a\u0644 RTL *\/\r\n        bottom: -5%;\r\n        width: 60%;\r\n        z-index: 1;\r\n        transition: transform 0.5s ease, opacity 0.3s ease;\r\n    }\r\n    \r\n    .ts-feat-image img {\r\n        width: 100%;\r\n        height: auto;\r\n        object-fit: contain;\r\n        filter: drop-shadow(0 20px 30px rgba(20, 17, 31, 0.2));\r\n        border-radius: 20px;\r\n    }\r\n\r\n    .ts-featured-card:hover .ts-feat-image { transform: translateY(-10px) scale(1.02); }\r\n\r\n    \/* SIDE LIST (RIGHT) *\/\r\n    .ts-side-list {\r\n        display: flex;\r\n        flex-direction: column;\r\n        gap: 24px;\r\n    }\r\n\r\n    .ts-side-card {\r\n        background: #fff;\r\n        border-radius: 20px;\r\n        padding: 16px;\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 20px;\r\n        border: 1px solid var(--ts-border);\r\n        transition: all 0.3s ease;\r\n        flex: 1;\r\n    }\r\n\r\n    .ts-side-card:hover {\r\n        box-shadow: 0 10px 30px rgba(121, 85, 232, 0.08);\r\n        border-color: var(--ts-purple-light);\r\n        transform: translateX(-5px); \/* \u062a\u0639\u062f\u064a\u0644 RTL *\/\r\n    }\r\n\r\n    .ts-side-img {\r\n        width: 140px;\r\n        height: 90px;\r\n        border-radius: 12px;\r\n        background: #f4efff;\r\n        overflow: hidden;\r\n        flex-shrink: 0;\r\n    }\r\n\r\n    .ts-side-img img { width: 100%; height: 100%; object-fit: cover; }\r\n    .ts-side-content { flex: 1; }\r\n\r\n    .ts-side-title { font-size: 18px; font-weight: 600; color: var(--ts-ink); margin-bottom: 6px; }\r\n    .ts-side-cat { font-size: 12px; color: var(--ts-muted); margin-bottom: 4px; }\r\n    .ts-side-tech { font-size: 12px; color: var(--ts-muted); }\r\n\r\n    .ts-side-arrow {\r\n        width: 32px;\r\n        height: 32px;\r\n        border-radius: 50%;\r\n        background: #f8f6ff;\r\n        color: var(--ts-purple);\r\n        display: grid;\r\n        place-items: center;\r\n        flex-shrink: 0;\r\n        transition: all 0.3s ease;\r\n    }\r\n\r\n    .ts-side-card:hover .ts-side-arrow { background: var(--ts-purple); color: #fff; }\r\n\r\n    \/* ==========================================================================\r\n       4. MOBILE SLIDER (Hidden on Desktop)\r\n       ========================================================================== *\/\r\n    .ts-mobile-slider { display: none; }\r\n\r\n    \/* ==========================================================================\r\n       5. RESPONSIVE DESIGN\r\n       ========================================================================== *\/\r\n    @media (max-width: 1024px) {\r\n        .ts-grid { grid-template-columns: 1fr; }\r\n        .ts-featured-card { min-height: 400px; }\r\n        .ts-feat-content { width: 60%; }\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        \/* Hide Desktop Grid & Controls *\/\r\n        .ts-grid { display: none; }\r\n        .ts-controls { display: none; }\r\n\r\n        \/* Show Mobile Slider *\/\r\n        .ts-mobile-slider {\r\n            display: flex;\r\n            overflow-x: auto;\r\n            scroll-snap-type: x mandatory;\r\n            gap: 16px;\r\n            padding-bottom: 20px;\r\n            padding-inline: 20px;\r\n            scroll-padding-inline: 20px;\r\n            scrollbar-width: none; \r\n            -ms-overflow-style: none;\r\n        }\r\n        .ts-mobile-slider::-webkit-scrollbar { display: none; }\r\n\r\n        \/* Mobile Card Styling *\/\r\n        .ts-mobile-card {\r\n            flex: 0 0 85%;\r\n            scroll-snap-align: center;\r\n            background: linear-gradient(135deg, #f3efff 0%, #e5dbff 100%);\r\n            border-radius: 24px;\r\n            padding: 24px;\r\n            display: flex;\r\n            flex-direction: column;\r\n            border: 1px solid rgba(255, 255, 255, 0.5);\r\n            box-shadow: 0 10px 25px rgba(121, 85, 232, 0.08);\r\n            position: relative;\r\n            overflow: hidden;\r\n        }\r\n\r\n        .ts-mobile-img {\r\n            width: 100%;\r\n            height: 200px;\r\n            border-radius: 16px;\r\n            overflow: hidden;\r\n            margin-bottom: 20px;\r\n            background: #fff;\r\n            position: relative;\r\n            z-index: 2;\r\n        }\r\n\r\n        .ts-mobile-img img { width: 100%; height: 100%; object-fit: cover; }\r\n        .ts-mobile-content { position: relative; z-index: 2; }\r\n\r\n        .ts-mobile-title {\r\n            font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n            font-size: 24px;\r\n            font-weight: 700;\r\n            color: var(--ts-ink);\r\n            margin-bottom: 8px;\r\n        }\r\n\r\n        .ts-mobile-tags {\r\n            font-size: 13px;\r\n            color: var(--ts-purple);\r\n            font-weight: 600;\r\n            margin-bottom: 12px;\r\n        }\r\n        \r\n        .ts-mobile-desc {\r\n            font-size: 14px;\r\n            color: var(--ts-muted);\r\n            line-height: 1.5;\r\n            margin-bottom: 20px;\r\n            display: -webkit-box;\r\n            -webkit-line-clamp: 3;\r\n            -webkit-box-orient: vertical;\r\n            overflow: hidden;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"ts-container\">\r\n    \r\n    <!-- HEADER -->\r\n    <div class=\"ts-header\">\r\n        <div class=\"ts-header-content\">\r\n            <span class=\"ts-kicker\">\u0623\u0628\u0631\u0632 \u0627\u0644\u0645\u0634\u0627\u0631\u064a\u0639<\/span>\r\n            <h2 class=\"ts-title\">\u0623\u062d\u062f\u062b <em>\u0623\u0639\u0645\u0627\u0644\u064a<\/em><\/h2>\r\n            <p class=\"ts-desc\">\u0645\u0634\u0627\u0631\u064a\u0639 \u062d\u0642\u064a\u0642\u064a\u0629 \u0648\u062d\u0644\u0648\u0644 \u0639\u0645\u0644\u064a\u0629. \u062f\u064a \u0634\u0648\u064a\u0629 \u0645\u0646 \u0627\u0644\u0645\u0648\u0627\u0642\u0639 \u0648\u0627\u0644\u0623\u0646\u0638\u0645\u0629 \u0627\u0644\u0644\u064a \u0628\u0646\u062a\u0647\u0627 \u0644\u0639\u0645\u0644\u0627\u0626\u064a \u0627\u0644\u0645\u0645\u064a\u0632\u064a\u0646.<\/p>\r\n            <a href=\"#\" class=\"ts-link\">\u0634\u0648\u0641 \u0643\u0644 \u0627\u0644\u0645\u0634\u0627\u0631\u064a\u0639 <span>\u2190<\/span><\/a>\r\n        <\/div>\r\n        \r\n        <div class=\"ts-controls\">\r\n            <!-- \u062a\u0645 \u0639\u0643\u0633 \u0627\u0644\u0623\u064a\u0642\u0648\u0646\u0627\u062a \u0644\u062a\u0646\u0627\u0633\u0628 \u0627\u0644\u0640 RTL -->\r\n            <button class=\"ts-nav-btn\" id=\"nextBtn\" aria-label=\"\u0627\u0644\u0633\u0627\u0628\u0642\">\r\n                <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M15 18l-6-6 6-6\"\/><\/svg>\r\n            <\/button>\r\n            <button class=\"ts-nav-btn\" id=\"prevBtn\" aria-label=\"\u0627\u0644\u062a\u0627\u0644\u064a\">\r\n                <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M9 18l6-6-6-6\"\/><\/svg>\r\n            <\/button>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <!-- DESKTOP GRID -->\r\n    <div class=\"ts-grid\" id=\"desktopGrid\">\r\n        <div class=\"ts-featured-card\">\r\n            <div class=\"ts-feat-content\">\r\n                <span class=\"ts-badge\">\r\n                    <svg width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\/><\/svg>\r\n                    \u0645\u0645\u064a\u0632\r\n                <\/span>\r\n                <h3 class=\"ts-feat-title\" id=\"featTitle\"><\/h3>\r\n                <div class=\"ts-feat-tags\" id=\"featTags\"><\/div>\r\n                <p class=\"ts-feat-desc\" id=\"featDesc\"><\/p>\r\n                <a href=\"#\" class=\"ts-link\" id=\"featLink\">\u0634\u0648\u0641 \u0627\u0644\u0645\u0634\u0631\u0648\u0639 <span>\u2190<\/span><\/a>\r\n            <\/div>\r\n            <div class=\"ts-feat-image\" id=\"featImageContainer\"><\/div>\r\n        <\/div>\r\n\r\n        <div class=\"ts-side-list\" id=\"sideList\"><\/div>\r\n    <\/div>\r\n\r\n    <!-- MOBILE SLIDER -->\r\n    <div class=\"ts-mobile-slider\" id=\"mobileSlider\"><\/div>\r\n\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', () => {\r\n    \/\/ 1. Data Array (Translated to Arabic)\r\n    const projects = [\r\n        { title: \"Enabah\", image: \"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Orange-Gradient-Modern-Laptop-Mockup-Instagram-Post-18.png\", category: \"\u0639\u0642\u0627\u0631\u0627\u062a \u0641\u0627\u062e\u0631\u0629\", tech: \"\u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633\", desc: \"\u0645\u0646\u0635\u0629 \u0639\u0642\u0627\u0631\u064a\u0629 \u0645\u0645\u064a\u0632\u0629 \u0644\u0639\u0631\u0636 \u0627\u0644\u0639\u0642\u0627\u0631\u0627\u062a \u0627\u0644\u0641\u0627\u062e\u0631\u0629.\", link: \"https:\/\/tarekseliman.com\/portfolio\/enabah\/\" },\r\n        { title: \"ON Media\", image: \"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Orange-Gradient-Modern-Laptop-Mockup-Instagram-Post-6.png\", category: \"\u062f\u0639\u0627\u064a\u0629 \u0648\u0637\u0628\u0627\u0639\u0629\", tech: \"\u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633\", desc: \"\u0645\u0648\u0642\u0639 \u0639\u0635\u0631\u064a \u0644\u0648\u0643\u0627\u0644\u0629 \u062f\u0639\u0627\u064a\u0629 \u0648\u0634\u0631\u0643\u0629 \u0637\u0628\u0627\u0639\u0629.\", link: \"https:\/\/tarekseliman.com\/portfolio\/on-media\/\" },\r\n        { title: \"Musandah\", image: \"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Orange-Gradient-Modern-Laptop-Mockup-Instagram-Post-4.png\", category: \"\u0625\u062f\u0627\u0631\u0629 \u0645\u0631\u0627\u0641\u0642\", tech: \"\u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633\", desc: \"\u0645\u0648\u0642\u0639 \u0627\u062d\u062a\u0631\u0627\u0641\u064a \u0644\u0634\u0631\u0643\u0629 \u062a\u0642\u062f\u0645 \u062e\u062f\u0645\u0627\u062a \u0625\u062f\u0627\u0631\u0629 \u0627\u0644\u0645\u0631\u0627\u0641\u0642.\", link: \"https:\/\/tarekseliman.com\/portfolio\/musandah\/\" },\r\n        { title: \"Enjaz Business\", image: \"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Orange-Gradient-Modern-Laptop-Mockup-Instagram-Post-16.png\", category: \"\u0627\u0633\u062a\u0634\u0627\u0631\u0627\u062a \u0634\u0631\u0643\u0627\u062a\", tech: \"\u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633\", desc: \"\u0645\u0648\u0642\u0639 \u0639\u0635\u0631\u064a \u0648\u0627\u062d\u062a\u0631\u0627\u0641\u064a \u0644\u0634\u0631\u0643\u0629 \u0623\u0639\u0645\u0627\u0644 \u0631\u0627\u0626\u062f\u0629.\", link: \"https:\/\/tarekseliman.com\/portfolio\/enjaz-business\/\" },\r\n        { title: \"OTX\", image: \"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Orange-Gradient-Modern-Laptop-Mockup-Instagram-Post-15.png\", category: \"\u0623\u0646\u0638\u0645\u0629 \u0634\u0631\u0643\u0627\u062a (SaaS)\", tech: \"\u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633\", desc: \"\u0645\u0646\u0635\u0629 \u0645\u062a\u0643\u0627\u0645\u0644\u0629 \u0645\u062a\u0635\u0645\u0645\u0629 \u062e\u0635\u064a\u0635\u0627\u064b \u0644\u0625\u062f\u0627\u0631\u0629 \u0639\u0645\u0644\u064a\u0627\u062a \u0627\u0644\u0634\u0631\u0643\u0627\u062a.\", link: \"https:\/\/tarekseliman.com\/portfolio\/otx\/\" },\r\n        { title: \"Pinekr\", image: \"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Orange-Gradient-Modern-Laptop-Mockup-Instagram-Post-14.png\", category: \"\u062a\u0643\u0646\u0648\u0644\u0648\u062c\u064a\u0627 \u062a\u0641\u0627\u0639\u0644\u064a\u0629\", tech: \"\u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633\", desc: \"\u0645\u0648\u0642\u0639 \u062a\u0641\u0627\u0639\u0644\u064a \u0628\u064a\u0639\u0631\u0636 \u0623\u062d\u062f\u062b \u0627\u0644\u062d\u0644\u0648\u0644 \u0627\u0644\u062a\u0643\u0646\u0648\u0644\u0648\u062c\u064a\u0629.\", link: \"https:\/\/tarekseliman.com\/portfolio\/pinekr\/\" },\r\n        { title: \"Al Waseed\", image: \"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Orange-Gradient-Modern-Laptop-Mockup-Instagram-Post-13.png\", category: \"\u0639\u0642\u0627\u0631\u0627\u062a\", tech: \"\u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633\", desc: \"\u0645\u0648\u0642\u0639 \u0639\u0642\u0627\u0631\u064a \u0645\u0645\u064a\u0632 \u0628\u0646\u0638\u0627\u0645 \u0628\u062d\u062b \u0648\u0641\u0644\u062a\u0631\u0629 \u0645\u062a\u0642\u062f\u0645.\", link: \"https:\/\/tarekseliman.com\/portfolio\/al-waseed\/\" },\r\n        { title: \"Nivra\", image: \"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Orange-Gradient-Modern-Laptop-Mockup-Instagram-Post-12.png\", category: \"\u0625\u0646\u062a\u0627\u062c \u0625\u0628\u062f\u0627\u0639\u064a\", tech: \"\u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633\", desc: \"\u0645\u0639\u0631\u0636 \u0623\u0639\u0645\u0627\u0644 \u062c\u0630\u0627\u0628 \u0644\u0627\u0633\u062a\u0648\u062f\u064a\u0648 \u0625\u0646\u062a\u0627\u062c \u0625\u0628\u062f\u0627\u0639\u064a.\", link: \"https:\/\/tarekseliman.com\/portfolio\/nivra\/\" },\r\n        { title: \"Extrover\", image: \"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Orange-Gradient-Modern-Laptop-Mockup-Instagram-Post-11.png\", category: \"\u0648\u0643\u0627\u0644\u0629 \u0631\u0642\u0645\u064a\u0629\", tech: \"\u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633\", desc: \"\u0645\u0648\u0642\u0639 \u0648\u0643\u0627\u0644\u0629 \u0631\u0642\u0645\u064a\u0629 \u0645\u062a\u0635\u0645\u0645 \u0639\u0634\u0627\u0646 \u064a\u0632\u0648\u062f \u0627\u0644\u0645\u0628\u064a\u0639\u0627\u062a \u0648\u0627\u0644\u0639\u0645\u0644\u0627\u0621.\", link: \"https:\/\/tarekseliman.com\/portfolio\/extrover\/\" },\r\n        { title: \"Activity Real Estate\", image: \"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Orange-Gradient-Modern-Laptop-Mockup-Instagram-Post-10.png\", category: \"\u0639\u0642\u0627\u0631\u0627\u062a\", tech: \"\u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633\", desc: \"\u0628\u0648\u0627\u0628\u0629 \u062f\u064a\u0646\u0627\u0645\u064a\u0643\u064a\u0629 \u0628\u062a\u0631\u0628\u0637 \u0627\u0644\u0645\u0634\u062a\u0631\u064a\u0646 \u0628\u0639\u0642\u0627\u0631\u0627\u062a \u0623\u062d\u0644\u0627\u0645\u0647\u0645.\", link: \"https:\/\/tarekseliman.com\/portfolio\/activity-real-estate\/\" }\r\n    ];\r\n\r\n    let currentIndex = 0;\r\n    const totalProjects = projects.length;\r\n    let autoplayTimer;\r\n    \r\n    \/\/ DOM Elements\r\n    const featTitle = document.getElementById('featTitle');\r\n    const featTags = document.getElementById('featTags');\r\n    const featDesc = document.getElementById('featDesc');\r\n    const featImageContainer = document.getElementById('featImageContainer');\r\n    const featLink = document.getElementById('featLink');\r\n    const sideList = document.getElementById('sideList');\r\n    const mobileSlider = document.getElementById('mobileSlider');\r\n    const desktopGrid = document.getElementById('desktopGrid');\r\n\r\n    \/\/ 2. Render Functions\r\n    function renderDesktopUI() {\r\n        const featured = projects[currentIndex];\r\n        featTitle.textContent = featured.title;\r\n        featTags.innerHTML = `${featured.category} <span>\u2022<\/span> ${featured.tech}`;\r\n        featDesc.textContent = featured.desc;\r\n        featLink.href = featured.link; \r\n        \r\n        featImageContainer.style.opacity = 0;\r\n        setTimeout(() => {\r\n            featImageContainer.innerHTML = `<img decoding=\"async\" src=\"${featured.image}\" alt=\"${featured.title}\">`;\r\n            featImageContainer.style.opacity = 1;\r\n        }, 200);\r\n\r\n        sideList.innerHTML = '';\r\n        for (let i = 1; i <= 3; i++) {\r\n            let index = (currentIndex + i) % totalProjects;\r\n            let project = projects[index];\r\n            \r\n            sideList.innerHTML += `\r\n                <a href=\"${project.link}\" class=\"ts-side-card\">\r\n                    <div class=\"ts-side-img\"><img decoding=\"async\" src=\"${project.image}\" alt=\"${project.title}\"><\/div>\r\n                    <div class=\"ts-side-content\">\r\n                        <h4 class=\"ts-side-title\">${project.title}<\/h4>\r\n                        <p class=\"ts-side-cat\">${project.category}<\/p>\r\n                        <p class=\"ts-side-tech\">${project.tech}<\/p>\r\n                    <\/div>\r\n                    <div class=\"ts-side-arrow\">\r\n                        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M19 12H5M12 19l-7-7 7-7\"\/><\/svg>\r\n                    <\/div>\r\n                <\/a>\r\n            `;\r\n        }\r\n    }\r\n\r\n    function renderMobileUI() {\r\n        mobileSlider.innerHTML = '';\r\n        projects.forEach(project => {\r\n            mobileSlider.innerHTML += `\r\n                <a href=\"${project.link}\" class=\"ts-mobile-card\">\r\n                    <div class=\"ts-mobile-img\"><img decoding=\"async\" src=\"${project.image}\" alt=\"${project.title}\"><\/div>\r\n                    <div class=\"ts-mobile-content\">\r\n                        <h3 class=\"ts-mobile-title\">${project.title}<\/h3>\r\n                        <div class=\"ts-mobile-tags\">${project.category} \u2022 ${project.tech}<\/div>\r\n                        <p class=\"ts-mobile-desc\">${project.desc}<\/p>\r\n                        <span class=\"ts-link\">\u0634\u0648\u0641 \u0627\u0644\u0645\u0634\u0631\u0648\u0639 <span>\u2190<\/span><\/span>\r\n                    <\/div>\r\n                <\/a>\r\n            `;\r\n        });\r\n    }\r\n\r\n    \/\/ 3. Autoplay Logic\r\n    function nextSlide() {\r\n        \/\/ Desktop Next\r\n        currentIndex = (currentIndex + 1) % totalProjects;\r\n        renderDesktopUI();\r\n\r\n        \/\/ Mobile Next (RTL Scroll)\r\n        if (window.innerWidth <= 768) {\r\n            const firstCard = mobileSlider.querySelector('.ts-mobile-card');\r\n            if (firstCard) {\r\n                const cardWidth = firstCard.offsetWidth + 16;\r\n                const maxScroll = mobileSlider.scrollWidth - mobileSlider.clientWidth;\r\n                \r\n                if (Math.abs(mobileSlider.scrollLeft) >= maxScroll - 10) {\r\n                    mobileSlider.scrollTo({ left: 0, behavior: 'smooth' });\r\n                } else {\r\n                    mobileSlider.scrollBy({ left: -cardWidth, behavior: 'smooth' });\r\n                }\r\n            }\r\n        }\r\n    }\r\n\r\n    function startAutoplay() {\r\n        clearInterval(autoplayTimer);\r\n        autoplayTimer = setInterval(nextSlide, 6000); \/\/ 6000ms = 6 seconds\r\n    }\r\n\r\n    \/\/ Stop autoplay on hover (Desktop)\r\n    desktopGrid.addEventListener('mouseenter', () => clearInterval(autoplayTimer));\r\n    desktopGrid.addEventListener('mouseleave', startAutoplay);\r\n\r\n    \/\/ Stop autoplay on touch (Mobile)\r\n    mobileSlider.addEventListener('touchstart', () => clearInterval(autoplayTimer));\r\n    mobileSlider.addEventListener('touchend', () => {\r\n        setTimeout(startAutoplay, 2000); \r\n    });\r\n\r\n    \/\/ 4. Arrow Clicks\r\n    document.getElementById('nextBtn').addEventListener('click', () => {\r\n        clearInterval(autoplayTimer);\r\n        currentIndex = (currentIndex + 1) % totalProjects;\r\n        renderDesktopUI();\r\n        startAutoplay(); \r\n    });\r\n\r\n    document.getElementById('prevBtn').addEventListener('click', () => {\r\n        clearInterval(autoplayTimer);\r\n        currentIndex = (currentIndex - 1 + totalProjects) % totalProjects;\r\n        renderDesktopUI();\r\n        startAutoplay(); \r\n    });\r\n\r\n    \/\/ Initialize Everything\r\n    renderDesktopUI();\r\n    renderMobileUI();\r\n    startAutoplay();\r\n});\r\n<\/script>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b8bda28 parte e-flex e-con-boxed e-con e-parent\" data-id=\"b8bda28\" data-element_type=\"container\" data-e-type=\"container\" id=\"parte\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c28a64c elementor-widget elementor-widget-html\" data-id=\"c28a64c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"ts-clients-title-wrapper\" dir=\"rtl\">\r\n    <span class=\"ts-subtitle\">\u0639\u0645\u0644\u0627\u0621 \u0648\u062b\u0642\u0648\u0627 \u0641\u064a\u0627<\/span>\r\n    <h2 class=\"ts-title\">\u0639\u0645\u0644\u0627\u0626\u064a <span class=\"ts-gradient-text\">\u0627\u0644\u0645\u0645\u064a\u0632\u064a\u0646<\/span><\/h2>\r\n<\/div>\r\n\r\n<style>\r\n\/* ==========================================================================\r\n   TS Animated Title - My Awesome Clients (Arabic Version)\r\n   ========================================================================== *\/\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap');\r\n\r\n.ts-clients-title-wrapper {\r\n    text-align: center;\r\n    margin-bottom: 40px;\r\n    position: relative;\r\n    z-index: 2; \/* \u0644\u064a\u0628\u0642\u0649 \u0641\u0648\u0642 \u0627\u0644\u062e\u0644\u0641\u064a\u0629 \u0627\u0644\u0645\u062a\u062d\u0631\u0643\u0629 *\/\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n}\r\n\r\n\/* 1. \u062a\u0635\u0645\u064a\u0645 \u0627\u0644\u0646\u0635 \u0627\u0644\u0635\u063a\u064a\u0631 (Subtitle) *\/\r\n.ts-clients-title-wrapper .ts-subtitle {\r\n    font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n    font-size: 13px;\r\n    font-weight: 600;\r\n    \/* \u062a\u0645 \u0625\u0632\u0627\u0644\u0629 letter-spacing \u0648 text-transform \u0644\u0623\u0646\u0647\u0627 \u0644\u0627 \u062a\u0646\u0627\u0633\u0628 \u0627\u0644\u0644\u063a\u0629 \u0627\u0644\u0639\u0631\u0628\u064a\u0629 *\/\r\n    color: #4A4663;\r\n    background: rgba(255, 255, 255, 0.5);\r\n    border: 1px solid rgba(255, 255, 255, 0.8);\r\n    padding: 6px 16px;\r\n    border-radius: 99px;\r\n    margin-bottom: 16px;\r\n    opacity: 0;\r\n    transform: translateY(20px);\r\n    animation: ts-title-reveal 0.8s cubic-bezier(0.2, 0.7, 0.1, 1) forwards;\r\n}\r\n\r\n\/* 2. \u062a\u0635\u0645\u064a\u0645 \u0627\u0644\u0639\u0646\u0648\u0627\u0646 \u0627\u0644\u0631\u0626\u064a\u0633\u064a *\/\r\n.ts-clients-title-wrapper .ts-title {\r\n    font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n    font-size: clamp(2.5rem, 5vw, 4rem);\r\n    font-weight: 700;\r\n    color: var(--ts-ink, #14111F);\r\n    line-height: 1.2;\r\n    margin: 0;\r\n    opacity: 0;\r\n    transform: translateY(20px);\r\n    animation: ts-title-reveal 0.8s cubic-bezier(0.2, 0.7, 0.1, 1) 0.2s forwards;\r\n}\r\n\r\n\/* 3. \u062a\u0623\u062b\u064a\u0631 \u0627\u0644\u0644\u0645\u0639\u0627\u0646 \u0627\u0644\u0645\u062a\u062f\u0631\u062c \u0627\u0644\u0645\u0633\u062a\u0645\u0631 \u0644\u0644\u0643\u0644\u0645\u0629 \u0627\u0644\u0645\u0645\u064a\u0632\u0629 *\/\r\n.ts-clients-title-wrapper .ts-gradient-text {\r\n    background: linear-gradient(\r\n        to left, \/* \u0639\u0643\u0633\u0646\u0627 \u0627\u0644\u0627\u062a\u062c\u0627\u0647 \u0639\u0634\u0627\u0646 \u064a\u0646\u0627\u0633\u0628 \u0627\u0644\u0640 RTL *\/\r\n        #9b88ed 20%, \r\n        #c084fc 40%, \r\n        #c084fc 60%, \r\n        #9b88ed 80%\r\n    );\r\n    background-size: 200% auto;\r\n    color: transparent;\r\n    -webkit-background-clip: text;\r\n    background-clip: text;\r\n    display: inline-block;\r\n    animation: ts-shine 4s linear infinite;\r\n    font-style: normal; \/* \u0634\u0644\u0646\u0627 \u0627\u0644\u0640 italic \u0639\u0634\u0627\u0646 \u0627\u0644\u062e\u0637 \u0627\u0644\u0639\u0631\u0628\u064a \u064a\u0643\u0648\u0646 \u0645\u0642\u0631\u0648\u0621 \u0648\u0623\u0634\u064a\u0643 *\/\r\n}\r\n\r\n\/* 4. \u062d\u0631\u0643\u0627\u062a \u0627\u0644\u0623\u0646\u064a\u0645\u064a\u0634\u0646 (Keyframes) *\/\r\n@keyframes ts-title-reveal {\r\n    to {\r\n        opacity: 1;\r\n        transform: translateY(0);\r\n    }\r\n}\r\n\r\n@keyframes ts-shine {\r\n    to {\r\n        background-position: -200% center; \/* \u0627\u062a\u0639\u0643\u0633\u062a \u0644\u0644\u064a\u0633\u0627\u0631 \u0645\u0639 \u062d\u0631\u0643\u0629 \u0627\u0644\u0642\u0631\u0627\u0621\u0629 *\/\r\n    }\r\n}\r\n\r\n\/* \u062a\u062c\u0627\u0648\u0628 \u0627\u0644\u0645\u0648\u0628\u0627\u064a\u0644 *\/\r\n@media (max-width: 768px) {\r\n    .ts-clients-title-wrapper {\r\n        margin-bottom: 30px;\r\n    }\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b7499f3 elementor-widget elementor-widget-image-gallery\" data-id=\"b7499f3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image-gallery.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-image-gallery\">\n\t\t\t<div id='gallery-1' class='gallery galleryid-921 gallery-columns-1 gallery-size-full'><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"895\" height=\"279\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/image-removebg-preview-10.png\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/image-removebg-preview-10.png 895w, https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/image-removebg-preview-10-300x94.png 300w, https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/image-removebg-preview-10-768x239.png 768w\" sizes=\"(max-width: 895px) 100vw, 895px\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img decoding=\"async\" width=\"300\" height=\"99\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/LOGO-removebg-preview-300x99-1.png\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img decoding=\"async\" width=\"474\" height=\"199\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/it_logo.png\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/it_logo.png 474w, https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/it_logo-300x126.png 300w\" sizes=\"(max-width: 474px) 100vw, 474px\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"100\" height=\"100\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Untitled-design-4-1-100x100-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"126\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/logo_elfalaky-removebg-preview-400x168-1-300x126-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"158\" height=\"76\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/output-onlinepngtools.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"165\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/image-removebg-preview-3-600x165-1.webp\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/image-removebg-preview-3-600x165-1.webp 600w, https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/image-removebg-preview-3-600x165-1-300x83.webp 300w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"143\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Untitled-design-28-300x143-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"612\" height=\"408\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/WhatsApp_Image_2026-10-17_at_12.42.17_AM-removebg-preview.png\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/WhatsApp_Image_2026-10-17_at_12.42.17_AM-removebg-preview.png 612w, https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/WhatsApp_Image_2026-10-17_at_12.42.17_AM-removebg-preview-300x200.png 300w\" sizes=\"(max-width: 612px) 100vw, 612px\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"116\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Untitled-design-27-300x116-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"116\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Untitled-design-26-300x116-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"101\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/image-removebg-preview-300x101-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"100\" height=\"100\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/image-photoroom-1-e1785777038791-100x100-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"88\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/logo-CrdKfG86-300x88-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"219\" height=\"154\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/cropped-logo-Recovered-Recovered-1.png\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"290\" height=\"231\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/untitled_design-removebg-preview-e1785776806582.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"448\" height=\"124\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/logo-1-1-1.webp\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/logo-1-1-1.webp 448w, https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/logo-1-1-1-300x83.webp 300w\" sizes=\"(max-width: 448px) 100vw, 448px\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"192\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/cropped-cropped-yalla-coins-png-1-1-1-300x192-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"254\" height=\"86\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/1000009882.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"209\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/on_media_logo-_jzifz0d-300x209-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"165\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Untitled-design-29-300x165-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"253\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/hq-medium2x-1024x682-Photoroom-e1785688888568-300x253-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"156\" height=\"43\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/2x-8-r6d9aglk6t27dwqdlf8eobkeu5vfvvaezejtkm8nu6-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"168\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/eventekr2x-8-1-1024x682-Photoroom-e1785688591272-300x168-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"99\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/2x-8-1-1024x640-Photoroom-e1785688508706-300x99-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"139\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/332-px4x-8-300x139-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"190\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/untitled_design_12-Photoroom-e1785688262686-300x190-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"129\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/1000009885-600x129-1.webp\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/1000009885-600x129-1.webp 600w, https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/1000009885-600x129-1-300x65.webp 300w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"82\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/WEB-02-06-2-600x82-1.webp\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/WEB-02-06-2-600x82-1.webp 600w, https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/WEB-02-06-2-600x82-1-300x41.webp 300w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"101\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/image-removebg-preview-4-300x101-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"98\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/output-onlinepngtools-1-300x98-1.webp\" class=\"attachment-full size-full\" alt=\"\" \/>\n\t\t\t<\/div><\/figure>\n\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3b76dd1 e-con-full e-flex e-con e-parent\" data-id=\"3b76dd1\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-82e0e41 elementor-widget elementor-widget-html\" data-id=\"82e0e41\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"ts-exact-match\" id=\"services\" dir=\"rtl\">\r\n<style>\r\n\/* ==========================================================================\r\n   Exact Match Design - With Animated Lines (Arabic Version)\r\n   ========================================================================== *\/\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap');\r\n\r\n.ts-exact-match {\r\n    --purple-main: #7a5ce8;\r\n    --purple-light: #a58bf0;\r\n    --text-dark: #1a1625;\r\n    --text-gray: #6b6878;\r\n    --card-bg: #ffffff;\r\n    --border-color: rgba(122, 92, 232, 0.12);\r\n    \r\n    position: relative;\r\n    width: 100%;\r\n    background: #fdfcff;\r\n    background-image: radial-gradient(circle at 40% 50%, rgba(235, 225, 255, 0.5) 0%, transparent 50%); \/* \u0639\u0643\u0633\u0646\u0627 \u0627\u0644\u0646\u0633\u0628\u0629 \u0644\u0640 40% \u0639\u0634\u0627\u0646 \u0627\u0644\u0640 RTL *\/\r\n    padding: 100px 0;\r\n    font-family: 'IBM Plex Sans Arabic', system-ui, sans-serif;\r\n    box-sizing: border-box;\r\n    overflow: hidden;\r\n}\r\n\r\n.ts-exact-match * { box-sizing: border-box; margin: 0; padding: 0; }\r\n.ts-exact-match a { text-decoration: none; color: inherit; }\r\n\r\n.ts-container {\r\n    width: min(1400px, calc(100% - 40px));\r\n    margin-inline: auto;\r\n    display: grid;\r\n    grid-template-columns: 0.8fr 1.2fr;\r\n    gap: 40px;\r\n    align-items: center;\r\n}\r\n\r\n\/* ==========================================================================\r\n   Right Content Area (was Left in LTR)\r\n   ========================================================================== *\/\r\n.ts-left {\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: flex-start;\r\n    padding-left: 20px; \/* \u0627\u062a\u063a\u064a\u0631\u062a \u0645\u0646 right \u0644\u0640 left *\/\r\n}\r\n\r\n.ts-kicker {\r\n    font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n    font-size: 13px;\r\n    font-weight: 700;\r\n    letter-spacing: 0.05em; \/* \u062a\u0642\u0644\u064a\u0644 \u0627\u0644\u062a\u0628\u0627\u0639\u062f \u0639\u0634\u0627\u0646 \u0627\u0644\u0639\u0631\u0628\u064a *\/\r\n    color: var(--purple-main);\r\n    margin-bottom: 16px;\r\n}\r\n\r\n.ts-title {\r\n    font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n    font-size: clamp(40px, 4.5vw, 68px);\r\n    font-weight: 700;\r\n    line-height: 1.2;\r\n    color: var(--text-dark);\r\n    margin-bottom: 24px;\r\n}\r\n\r\n.ts-title em {\r\n    font-style: normal;\r\n    color: var(--purple-main);\r\n}\r\n\r\n.ts-desc {\r\n    font-size: 15px;\r\n    line-height: 1.8;\r\n    color: var(--text-gray);\r\n    max-width: 380px;\r\n    margin-bottom: 40px;\r\n}\r\n\r\n.ts-btn {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n    padding: 12px 24px;\r\n    border-radius: 99px;\r\n    background: transparent;\r\n    border: 1px solid rgba(122, 92, 232, 0.25);\r\n    color: var(--text-dark);\r\n    font-size: 14px;\r\n    font-weight: 600;\r\n    transition: all 0.3s ease;\r\n}\r\n\r\n.ts-btn:hover {\r\n    background: #ffffff;\r\n    border-color: var(--purple-main);\r\n    color: var(--purple-main);\r\n    box-shadow: 0 4px 15px rgba(122, 92, 232, 0.1);\r\n}\r\n\r\n\/* ==========================================================================\r\n   Left Diagram Area (was Right in LTR)\r\n   ========================================================================== *\/\r\n.ts-diagram {\r\n    position: relative;\r\n    display: grid;\r\n    grid-template-columns: 1fr 280px 1fr;\r\n    grid-template-rows: auto auto;\r\n    gap: 60px 20px;\r\n    align-items: center;\r\n    padding: 20px 0;\r\n}\r\n\r\n\/* SVG for Lines *\/\r\n.ts-connector-svg {\r\n    position: absolute;\r\n    inset: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    pointer-events: none;\r\n    z-index: 1;\r\n}\r\n\r\n\/* ==========================================================================\r\n   Animation Keyframes & Targets\r\n   ========================================================================== *\/\r\n@keyframes lineFlow {\r\n    from { stroke-dashoffset: 40; }\r\n    to { stroke-dashoffset: 0; }\r\n}\r\n\r\n@keyframes dotPulse {\r\n    0% { transform: scale(1); opacity: 0.3; }\r\n    50% { transform: scale(1.8); opacity: 0.9; }\r\n    100% { transform: scale(1); opacity: 0.3; }\r\n}\r\n\r\n\/* Apply animation to SVG lines *\/\r\n.ts-connector-svg line {\r\n    animation: lineFlow 2.5s linear infinite;\r\n}\r\n\r\n\/* Apply animation to SVG dots *\/\r\n.ts-connector-svg circle {\r\n    transform-box: fill-box;\r\n    transform-origin: center;\r\n    animation: dotPulse 2s ease-in-out infinite;\r\n}\r\n\/* ========================================================================== *\/\r\n\r\n\/* Center Orbiting Nucleus *\/\r\n.ts-center-orb {\r\n    grid-column: 2;\r\n    grid-row: 1 \/ 3;\r\n    position: relative;\r\n    width: 240px;\r\n    height: 240px;\r\n    border-radius: 50%;\r\n    background: #ffffff;\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    justify-content: center;\r\n    text-align: center;\r\n    z-index: 5;\r\n    margin-inline: auto;\r\n    box-shadow: 0 10px 40px rgba(122, 92, 232, 0.08);\r\n}\r\n\r\n\/* Inner and Outer Glowing Rings *\/\r\n.ts-center-orb::before {\r\n    content: '';\r\n    position: absolute;\r\n    inset: -12px;\r\n    border-radius: 50%;\r\n    border: 1px solid rgba(122, 92, 232, 0.15);\r\n    box-shadow: 0 0 30px rgba(122, 92, 232, 0.05), inset 0 0 20px rgba(122, 92, 232, 0.05);\r\n    background: transparent;\r\n}\r\n.ts-center-orb::after {\r\n    content: '';\r\n    position: absolute;\r\n    inset: -24px;\r\n    border-radius: 50%;\r\n    border: 1px dashed rgba(122, 92, 232, 0.25);\r\n    background: transparent;\r\n}\r\n\r\n\/* Dots on the dashed ring *\/\r\n.orb-dot {\r\n    position: absolute;\r\n    width: 6px;\r\n    height: 6px;\r\n    background: var(--purple-main);\r\n    border-radius: 50%;\r\n    z-index: 6;\r\n}\r\n.orb-dot.top { top: -27px; left: 50%; transform: translateX(-50%); }\r\n.orb-dot.bottom { bottom: -27px; left: 50%; transform: translateX(-50%); }\r\n.orb-dot.left { left: -27px; top: 50%; transform: translateY(-50%); }\r\n.orb-dot.right { right: -27px; top: 50%; transform: translateY(-50%); }\r\n\r\n.orb-name {\r\n    font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n    font-size: 20px;\r\n    font-weight: 700;\r\n    color: var(--text-dark);\r\n    margin-bottom: 8px;\r\n}\r\n\r\n.orb-sub {\r\n    font-size: 12px;\r\n    line-height: 1.5;\r\n    color: var(--text-gray);\r\n    max-width: 140px;\r\n    margin-bottom: 12px;\r\n}\r\n\r\n\/* \u062a\u062d\u062f\u064a\u062b \u0634\u0643\u0644 \u0627\u0644\u0644\u0648\u062c\u0648 \u0644\u064a\u0643\u0648\u0646 \u0635\u0648\u0631\u0629 *\/\r\n.orb-logo {\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    height: 40px;\r\n}\r\n.orb-logo img {\r\n    max-height: 100%;\r\n    width: auto;\r\n    max-width: 100px;\r\n    object-fit: contain;\r\n}\r\n\r\n\/* Cards *\/\r\n.ts-card {\r\n    background: var(--card-bg);\r\n    border: 1px solid var(--border-color);\r\n    border-radius: 16px;\r\n    padding: 24px;\r\n    display: flex;\r\n    align-items: flex-start;\r\n    gap: 16px;\r\n    box-shadow: 0 8px 24px rgba(26, 22, 37, 0.02);\r\n    z-index: 10;\r\n    position: relative;\r\n    transition: transform 0.3s ease, box-shadow 0.3s ease;\r\n    width: 100%;\r\n}\r\n\r\n.ts-card:hover {\r\n    transform: translateY(-3px);\r\n    box-shadow: 0 12px 30px rgba(122, 92, 232, 0.08);\r\n}\r\n\r\n.ts-icon {\r\n    width: 42px;\r\n    height: 42px;\r\n    border-radius: 10px;\r\n    background: #f8f6ff;\r\n    display: grid;\r\n    place-items: center;\r\n    flex-shrink: 0;\r\n}\r\n.ts-icon svg { width: 22px; height: 22px; }\r\n\r\n.ts-card-content h3 {\r\n    font-size: 15px;\r\n    font-weight: 600;\r\n    color: var(--text-dark);\r\n    margin-bottom: 12px;\r\n}\r\n\r\n.ts-list {\r\n    list-style: none;\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 8px;\r\n}\r\n\r\n.ts-list li {\r\n    font-size: 12px;\r\n    color: var(--text-gray);\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 8px;\r\n}\r\n\r\n.ts-list li::before {\r\n    content: \"\u2713\";\r\n    color: var(--purple-main);\r\n    font-size: 10px;\r\n    font-weight: bold;\r\n}\r\n\r\n\/* Card Placements *\/\r\n.card-tl { grid-column: 1; grid-row: 1; justify-self: end; }\r\n.card-tr { grid-column: 3; grid-row: 1; justify-self: start; }\r\n.card-bl { grid-column: 1; grid-row: 2; justify-self: end; }\r\n.card-br { grid-column: 3; grid-row: 2; justify-self: start; }\r\n\r\n\/* ==========================================================================\r\n   Responsive Design\r\n   ========================================================================== *\/\r\n@media (max-width: 1250px) {\r\n    .ts-diagram {\r\n        grid-template-columns: 1fr 220px 1fr;\r\n        gap: 40px 15px;\r\n    }\r\n    .ts-center-orb {\r\n        width: 200px;\r\n        height: 200px;\r\n    }\r\n}\r\n\r\n@media (max-width: 1024px) {\r\n    .ts-container {\r\n        grid-template-columns: 1fr;\r\n        gap: 80px;\r\n    }\r\n    .ts-left {\r\n        text-align: center;\r\n        align-items: center;\r\n        padding-left: 0;\r\n    }\r\n    .ts-desc { max-width: 500px; }\r\n    .ts-diagram {\r\n        grid-template-columns: 1fr 260px 1fr;\r\n        max-width: 900px;\r\n        margin-inline: auto;\r\n    }\r\n}\r\n\r\n@media (max-width: 850px) {\r\n    .ts-diagram {\r\n        grid-template-columns: 1fr;\r\n        gap: 20px;\r\n    }\r\n    .card-tl, .card-tr, .card-bl, .card-br {\r\n        grid-column: 1;\r\n        grid-row: auto;\r\n    }\r\n    .ts-center-orb, .ts-connector-svg, .orb-dot {\r\n        display: none;\r\n    }\r\n}\r\n<\/style>\r\n\r\n<div class=\"ts-container\">\r\n    <!-- RIGHT CONTENT (Was Left in LTR) -->\r\n    <div class=\"ts-left\">\r\n        <span class=\"ts-kicker\">\u0627\u0644\u0644\u064a \u0623\u0642\u062f\u0631 \u0623\u0642\u062f\u0645\u0647 \u0644\u0643<\/span>\r\n        <h2 class=\"ts-title\">\u0628\u0628\u0631\u0645\u062c \u0648 <em>\u0628\u062f\u064a\u0631<\/em><\/h2>\r\n        <p class=\"ts-desc\">\u0645\u0646 \u0623\u0648\u0644 \u0627\u0644\u0642\u0648\u0627\u0644\u0628 \u0627\u0644\u0645\u062e\u0635\u0635\u0629 \u0644\u062d\u062f \u0627\u0644\u0623\u0646\u0638\u0645\u0629 \u0627\u0644\u0645\u0639\u0642\u062f\u0629\u060c \u0628\u0642\u062f\u0645 \u0644\u0643 \u062d\u0644\u0648\u0644 \u0648\u064a\u0628 \u0645\u062a\u0643\u0627\u0645\u0644\u0629 \u0645\u062a\u0641\u0635\u0644\u0629 \u0628\u0627\u0644\u0638\u0628\u0637 \u0639\u0644\u0649 \u0645\u0642\u0627\u0633 \u0634\u063a\u0644\u0643.<\/p>\r\n        <a href=\"#services\" class=\"ts-btn\">\u0634\u0648\u0641 \u0643\u0644 \u062e\u062f\u0645\u0627\u062a\u064a &larr;<\/a>\r\n    <\/div>\r\n\r\n    <!-- LEFT DIAGRAM (Was Right in LTR) -->\r\n    <div class=\"ts-diagram\">\r\n        <!-- Connecting Lines (SVG) -->\r\n        <svg class=\"ts-connector-svg\" viewBox=\"0 0 100 100\" preserveAspectRatio=\"none\">\r\n            <line x1=\"50\" y1=\"50\" x2=\"10\" y2=\"15\" stroke=\"#7a5ce8\" stroke-opacity=\"0.3\" stroke-width=\"0.3\" stroke-dasharray=\"2 2\"\/>\r\n            <line x1=\"50\" y1=\"50\" x2=\"90\" y2=\"15\" stroke=\"#7a5ce8\" stroke-opacity=\"0.3\" stroke-width=\"0.3\" stroke-dasharray=\"2 2\"\/>\r\n            <line x1=\"50\" y1=\"50\" x2=\"10\" y2=\"85\" stroke=\"#7a5ce8\" stroke-opacity=\"0.3\" stroke-width=\"0.3\" stroke-dasharray=\"2 2\"\/>\r\n            <line x1=\"50\" y1=\"50\" x2=\"90\" y2=\"85\" stroke=\"#7a5ce8\" stroke-opacity=\"0.3\" stroke-width=\"0.3\" stroke-dasharray=\"2 2\"\/>\r\n            <circle cx=\"30\" cy=\"32.5\" r=\"0.5\" fill=\"#7a5ce8\" opacity=\"0.5\"\/>\r\n            <circle cx=\"70\" cy=\"32.5\" r=\"0.5\" fill=\"#7a5ce8\" opacity=\"0.5\"\/>\r\n            <circle cx=\"30\" cy=\"67.5\" r=\"0.5\" fill=\"#7a5ce8\" opacity=\"0.5\"\/>\r\n            <circle cx=\"70\" cy=\"67.5\" r=\"0.5\" fill=\"#7a5ce8\" opacity=\"0.5\"\/>\r\n        <\/svg>\r\n\r\n        <!-- Center Orb -->\r\n        <div class=\"ts-center-orb\">\r\n            <span class=\"orb-dot top\"><\/span>\r\n            <span class=\"orb-dot bottom\"><\/span>\r\n            <span class=\"orb-dot left\"><\/span>\r\n            <span class=\"orb-dot right\"><\/span>\r\n            <h4 class=\"orb-name\">\u0637\u0627\u0631\u0642 \u0633\u0644\u064a\u0645\u0627\u0646.<\/h4>\r\n            <span class=\"orb-sub\">\u0645\u0637\u0648\u0631 \u0648\u064a\u0628<br\/>\u0648\u0645\u0647\u0646\u062f\u0633 \u0623\u0646\u0638\u0645\u0629<\/span>\r\n            <!-- \u062a\u0645 \u0627\u0633\u062a\u0628\u062f\u0627\u0644 \u062d\u0631\u0641 X \u0628\u0627\u0644\u0635\u0648\u0631\u0629 \u0647\u0646\u0627 -->\r\n            <span class=\"orb-logo\"><img decoding=\"async\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/cropped-circle_1200_1785516291607.png\" alt=\"Raven X Logo\" loading=\"lazy\"><\/span>\r\n        <\/div>\r\n\r\n        <!-- Card 1: WordPress -->\r\n        <div class=\"ts-card card-tl\">\r\n            <div class=\"ts-icon\">\r\n                <svg viewBox=\"0 0 128 128\" fill=\"#21759b\">\r\n                    <path d=\"M64 10.4C34.4 10.4 10.4 34.4 10.4 64s24 53.6 53.6 53.6 53.6-24 53.6-53.6S93.6 10.4 64 10.4zM99.6 44.9c1 2.3 1.5 5 1.5 8 0 5-1.4 9.5-3.6 13.9-3.8 7.3-15.5 35.8-15.5 35.8-13.4-3.8-23.7-14.8-26.6-28.7l16.1-45.7c1-.8 1.4-1.5 1.4-2.5 0-1.6-1.3-2.9-2.9-2.9-.6 0-1.1.2-1.5.5L52.8 39c.6-.1 1.2-.2 1.9-.2 5.5 0 9.7 1.4 13.4 4.5l1.9-4.8c4.2 2 8 4.7 11.2 8.1l2.4-1.7zm-67.7 5.7c4 0 7.8 1.5 10.6 4.3 2.1 2.1 3.4 5 3.4 8.2 0 4.1-2 7.7-5.1 10.1l-10.7-5.5c-.8-.4-1.8-.7-2.8-.7-2.1 0-3.9 1.1-4.9 2.8l1.4 3.7c1.3-1 2.9-1.6 4.6-1.6 1.8 0 3.5.7 4.7 1.8l-1.3-3.6zM28.4 64c0-10.4 4.5-19.7 11.6-26.1l18.5 52C42.8 86.8 30.6 77 28.4 64zm35.6 41.5c-3.7 0-7.3-.6-10.6-1.7l11.4-32.3L76 103.8c-3.8 1.1-7.8 1.7-12 1.7z\"\/>\r\n                <\/svg>\r\n            <\/div>\r\n            <div class=\"ts-card-content\">\r\n                <h3>\u062a\u0637\u0648\u064a\u0631 \u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633<\/h3>\r\n                <ul class=\"ts-list\">\r\n                    <li>\u0642\u0648\u0627\u0644\u0628 \u0645\u062e\u0635\u0635\u0629<\/li>\r\n                    <li>\u0625\u0636\u0627\u0641\u0627\u062a \u0648\u0648\u0648\u0643\u0648\u0645\u0631\u0633<\/li>\r\n                    <li>\u0625\u0644\u064a\u0645\u0646\u062a\u0648\u0631 \u0628\u0631\u0648<\/li>\r\n                <\/ul>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <!-- Card 2: Shopify -->\r\n        <div class=\"ts-card card-tr\">\r\n            <div class=\"ts-icon\">\r\n                <svg viewBox=\"0 0 109 124\" fill=\"#95BF47\">\r\n                    <path d=\"M79.5 22.4c-.4-.4-1-.5-1.4-.4-.3.1-6 2.6-11.7 5.1-3.6-7.8-8.8-15.3-17.1-15.3-.6 0-1.1.1-1.7.3-2.3.7-4.5 2.5-6.1 5.1-4.4 6.7-5.3 16.5-2.9 29.1-8.2 2.6-14 4.4-14.3 4.5-4.4 1.4-4.5 1.6-5.1 5.9L4.6 96.6 67.8 109l40.7-9.5L79.5 22.4z\"\/>\r\n                    <path fill=\"#5E8E3E\" d=\"M57.5 44.5l-9.2-2.7c2.4-12.6 3.3-22.4 7.7-29.1 1.6-2.6 3.8-4.4 6.1-5.1.6-.2 1.1-.3 1.7-.3 8.3 0 13.5 7.5 17.1 15.3-8.8 3.8-17.6 7.7-23.4 10.2v11.7z\"\/>\r\n                <\/svg>\r\n            <\/div>\r\n            <div class=\"ts-card-content\">\r\n                <h3>\u062a\u0637\u0648\u064a\u0631 \u0634\u0648\u0628\u064a\u0641\u0627\u064a<\/h3>\r\n                <ul class=\"ts-list\">\r\n                    <li>\u062a\u062c\u0647\u064a\u0632 \u0648\u062a\u062e\u0635\u064a\u0635 \u0627\u0644\u0645\u062a\u062c\u0631<\/li>\r\n                    <li>\u0644\u064a\u0643\u0648\u064a\u062f \u0648\u0631\u0628\u0637 \u0627\u0644\u0623\u0646\u0638\u0645\u0629<\/li>\r\n                    <li>\u062a\u0637\u0628\u064a\u0642\u0627\u062a \u0648\u062e\u062f\u0645\u0627\u062a \u062e\u0627\u0631\u062c\u064a\u0629<\/li>\r\n                <\/ul>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <!-- Card 3: Server -->\r\n        <div class=\"ts-card card-bl\">\r\n            <div class=\"ts-icon\">\r\n                <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#7a5ce8\" stroke-width=\"2\" stroke-linecap=\"round\">\r\n                    <rect x=\"2\" y=\"3\" width=\"20\" height=\"7\" rx=\"2\"\/>\r\n                    <rect x=\"2\" y=\"14\" width=\"20\" height=\"7\" rx=\"2\"\/>\r\n                    <line x1=\"6\" y1=\"6.5\" x2=\"6.01\" y2=\"6.5\"\/>\r\n                    <line x1=\"6\" y1=\"17.5\" x2=\"6.01\" y2=\"17.5\"\/>\r\n                <\/svg>\r\n            <\/div>\r\n            <div class=\"ts-card-content\">\r\n                <h3>\u0633\u064a\u0631\u0641\u0631\u0627\u062a \u0648\u0628\u0646\u064a\u0629 \u062a\u062d\u062a\u064a\u0629<\/h3>\r\n                <ul class=\"ts-list\">\r\n                    <li>\u0627\u0633\u062a\u0636\u0627\u0641\u0629 \u0648 cPanel \/ CWP<\/li>\r\n                    <li>\u062d\u0645\u0627\u064a\u0629 \u0648\u062a\u062d\u0633\u064a\u0646 \u0623\u062f\u0627\u0621<\/li>\r\n                    <li>\u0646\u0633\u062e \u0627\u062d\u062a\u064a\u0627\u0637\u064a \u0648\u0646\u0634\u0631<\/li>\r\n                <\/ul>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <!-- Card 4: Web Apps -->\r\n        <div class=\"ts-card card-br\">\r\n            <div class=\"ts-icon\">\r\n                <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#7a5ce8\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n                    <polyline points=\"16 18 22 12 16 6\"\/>\r\n                    <polyline points=\"8 6 2 12 8 18\"\/>\r\n                <\/svg>\r\n            <\/div>\r\n            <div class=\"ts-card-content\">\r\n                <h3>\u062a\u0637\u0628\u064a\u0642\u0627\u062a \u0627\u0644\u0648\u064a\u0628<\/h3>\r\n                <ul class=\"ts-list\">\r\n                    <li>\u0648\u0627\u062c\u0647\u0627\u062a \u0628\u0631\u0645\u062c\u064a\u0629 API \u0648\u0631\u0628\u0637<\/li>\r\n                    <li>\u0644\u0648\u062d\u0627\u062a \u062a\u062d\u0643\u0645 \u0648\u0623\u0646\u0638\u0645\u0629<\/li>\r\n                    <li>\u0648\u0627\u062c\u0647\u0627\u062a \u0623\u0645\u0627\u0645\u064a\u0629 \u0648\u062e\u0644\u0641\u064a\u0629<\/li>\r\n                <\/ul>\r\n            <\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n<\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-badeb6a e-con-full e-flex e-con e-parent\" data-id=\"badeb6a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f1b9533 elementor-widget elementor-widget-html\" data-id=\"f1b9533\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"ts-about-section\" id=\"about\" dir=\"rtl\">\r\n<style>\r\n\/* \u0627\u0633\u062a\u062f\u0639\u0627\u0621 \u062e\u0637 IBM Plex Sans Arabic \u0648\u062a\u0637\u0628\u064a\u0642\u0647 \u0639\u0644\u0649 \u0643\u0644 \u0627\u0644\u0639\u0646\u0627\u0635\u0631 *\/\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap');\r\n\r\n.ts-about-section {\r\n    --ts-ink: #171421;\r\n    --ts-muted: #666375;\r\n    --ts-purple: #7955e8;\r\n    --ts-border: #eae5f5;\r\n    position: relative;\r\n    width: 100%;\r\n    background: #faf9fc;\r\n    background-image: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(245,242,255,.4) 100%);\r\n    padding: 50px 0;\r\n    font-family: 'IBM Plex Sans Arabic', system-ui, sans-serif;\r\n    color: var(--ts-ink);\r\n    box-sizing: border-box;\r\n    overflow: hidden;\r\n}\r\n.ts-about-section *,.ts-about-section *::before,.ts-about-section *::after { box-sizing: border-box; }\r\n.ts-about-section a { text-decoration: none; color: inherit; }\r\n.ts-about-section img { max-width: 100%; display: block; }\r\n.ts-about-container {\r\n    width: min(1350px, calc(100% - 48px));\r\n    margin-inline: auto;\r\n    display: grid;\r\n    grid-template-columns: 1.1fr 1.1fr 1.2fr;\r\n    gap: 50px;\r\n    align-items: center;\r\n}\r\n.ts-about-visual {\r\n    position: relative;\r\n    border-radius: 20px;\r\n    overflow: hidden;\r\n    box-shadow: 0 20px 50px rgba(20,17,31,.1);\r\n    aspect-ratio: 16\/10;\r\n}\r\n.ts-about-visual img { width: 100%; height: 100%; object-fit: cover; }\r\n.ts-about-visual::after {\r\n    content: '';\r\n    position: absolute;\r\n    inset: 0;\r\n    background: linear-gradient(to top, rgba(15,10,30,.7) 0%, rgba(15,10,30,.1) 50%, transparent 100%);\r\n    pointer-events: none;\r\n}\r\n.ts-about-text-overlay {\r\n    position: absolute;\r\n    top: 30px;\r\n    right: 30px; \/* \u062a\u0639\u062f\u064a\u0644 \u0627\u0644\u0640 RTL *\/\r\n    z-index: 2;\r\n    color: #fff;\r\n}\r\n.ts-about-text-overlay h4 {\r\n    font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n    font-size: 32px;\r\n    line-height: 1.3;\r\n    font-weight: 700;\r\n    margin-bottom: 15px;\r\n    text-shadow: 0 2px 10px rgba(0,0,0,.5);\r\n}\r\n.ts-about-content {\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: flex-start;\r\n}\r\n.ts-about-kicker {\r\n    font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n    font-size: 13px;\r\n    font-weight: 700;\r\n    letter-spacing: 0.05em;\r\n    color: var(--ts-purple);\r\n    margin-bottom: 12px;\r\n}\r\n.ts-about-title {\r\n    font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n    font-size: clamp(32px, 3.5vw, 46px);\r\n    font-weight: 700;\r\n    line-height: 1.2;\r\n    color: var(--ts-ink);\r\n    margin-bottom: 24px;\r\n}\r\n.ts-about-title em {\r\n    font-style: normal; \/* \u0634\u064a\u0644\u0646\u0627 \u0627\u0644\u0645\u064a\u0644 \u0639\u0634\u0627\u0646 \u0627\u0644\u0639\u0631\u0628\u064a \u064a\u0643\u0648\u0646 \u0623\u0648\u0636\u062d *\/\r\n    color: var(--ts-purple);\r\n    font-weight: 700;\r\n}\r\n.ts-about-desc {\r\n    font-size: 15px;\r\n    line-height: 1.8;\r\n    color: var(--ts-muted);\r\n    margin-bottom: 30px;\r\n}\r\n.ts-about-link {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 8px;\r\n    font-size: 14px;\r\n    font-weight: 600;\r\n    color: var(--ts-ink);\r\n    transition: gap .3s ease, color .3s ease;\r\n}\r\n.ts-about-link:hover { gap: 12px; color: var(--ts-purple); }\r\n.ts-about-signature {\r\n    display: block;\r\n    height: auto;\r\n    margin-top: 40px;\r\n    width: 120px;\r\n    max-width: 100%;\r\n    opacity: .9;\r\n}\r\n.ts-about-timeline {\r\n    position: relative;\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 30px;\r\n    padding-right: 10px; \/* \u062a\u0639\u062f\u064a\u0644 \u0627\u0644\u0640 RTL *\/\r\n}\r\n.ts-about-timeline::before {\r\n    content: '';\r\n    position: absolute;\r\n    top: 20px;\r\n    bottom: 20px;\r\n    right: 34px; \/* \u062a\u0639\u062f\u064a\u0644 \u0627\u0644\u0640 RTL \u0644\u062e\u0637 \u0627\u0644\u062a\u0627\u064a\u0645 \u0644\u0627\u064a\u0646 *\/\r\n    width: 1px;\r\n    background: var(--ts-border);\r\n    z-index: 0;\r\n}\r\n.ts-timeline-item {\r\n    position: relative;\r\n    display: flex;\r\n    align-items: flex-start;\r\n    gap: 20px;\r\n    z-index: 1;\r\n}\r\n.ts-timeline-icon {\r\n    width: 48px;\r\n    height: 48px;\r\n    border-radius: 50%;\r\n    background: #fff;\r\n    border: 1px solid var(--ts-border);\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    flex-shrink: 0;\r\n    color: var(--ts-purple);\r\n    box-shadow: 0 4px 10px rgba(20,17,31,.02);\r\n}\r\n.ts-timeline-icon svg { width: 20px; height: 20px; stroke: currentColor; stroke-width: 1.5; fill: none; }\r\n.ts-timeline-content { padding-top: 2px; }\r\n.ts-timeline-content h4 {\r\n    font-size: 14px;\r\n    font-weight: 700;\r\n    color: var(--ts-ink);\r\n    margin-bottom: 4px;\r\n    display: flex;\r\n    align-items: center;\r\n    flex-wrap: wrap;\r\n    gap: 8px;\r\n}\r\n.ts-timeline-content h4 span {\r\n    font-size: 12px;\r\n    font-weight: 500;\r\n    color: #9995a5;\r\n    direction: ltr; \/* \u0639\u0634\u0627\u0646 @ \u062a\u0638\u0647\u0631 \u0628\u0634\u0643\u0644 \u0645\u0638\u0628\u0648\u0637 \u0644\u0648 \u062c\u0645\u0628\u0647\u0627 \u0627\u0646\u062c\u0644\u064a\u0632\u064a *\/\r\n}\r\n.ts-timeline-content p {\r\n    font-size: 12px;\r\n    color: #9995a5;\r\n    font-weight: 500;\r\n}\r\n@media (max-width: 1100px) {\r\n    .ts-about-container { grid-template-columns: 1fr 1fr; gap: 40px; }\r\n    .ts-about-timeline { grid-column: 1 \/ -1; max-width: 700px; margin: 40px auto 0; padding-right: 0; }\r\n    .ts-about-timeline::before { right: 24px; } \/* \u062a\u0638\u0628\u064a\u0637 \u0627\u0644\u062e\u0637 \u0639\u0644\u0649 \u0627\u0644\u0634\u0627\u0634\u0627\u062a \u0627\u0644\u0623\u0635\u063a\u0631 \u0644\u0644\u0640 RTL *\/\r\n}\r\n@media (max-width: 768px) {\r\n    .ts-about-section { padding: 40px 0; }\r\n    .ts-about-container { grid-template-columns: 1fr; gap: 50px; }\r\n    .ts-about-visual { aspect-ratio: 16\/11; }\r\n    .ts-about-content { text-align: center; align-items: center; }\r\n    .ts-about-signature { margin-top: 20px; }\r\n    .ts-about-timeline { margin: 0; }\r\n}\r\n<\/style>\r\n\r\n<div class=\"ts-about-container\">\r\n    <div class=\"ts-about-visual\">\r\n        <img decoding=\"async\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Untitled-design-37.png\" alt=\"Workspace\" loading=\"lazy\">\r\n        <div class=\"ts-about-text-overlay\">\r\n            <h4>\u0628\u0631\u0645\u062c<br\/>\u062d\u0644<br\/>\u0637\u0648\u0651\u0631<\/h4>\r\n        <\/div>\r\n    <\/div>\r\n    \r\n    <div class=\"ts-about-content\">\r\n        <span class=\"ts-about-kicker\">\u0646\u0628\u0630\u0629 \u0639\u0646\u064a<\/span>\r\n        <h2 class=\"ts-about-title\">\u0623\u0643\u062a\u0631 \u0645\u0646 \u0645\u062c\u0631\u062f <em>\u0645\u0637\u0648\u0631<\/em><\/h2>\r\n        <p class=\"ts-about-desc\">\u0623\u0646\u0627 \u0637\u0627\u0631\u0642 \u0633\u0644\u064a\u0645\u0627\u0646\u060c \u0645\u0637\u0648\u0631 \u0648\u064a\u0628 \u0648\u0645\u062f\u064a\u0631 \u0633\u064a\u0631\u0641\u0631\u0627\u062a (System Administrator). \u062e\u0628\u0631\u062a\u064a \u0623\u0643\u062a\u0631 \u0645\u0646 10 \u0633\u0646\u064a\u0646 \u0641\u064a \u0628\u0646\u0627\u0621 \u0648\u062a\u0637\u0648\u064a\u0631 \u0627\u0644\u0623\u0646\u0638\u0645\u0629 \u0627\u0644\u0645\u0639\u0642\u062f\u0629\u060c \u0648\u0628\u062c\u0645\u0639 \u0628\u064a\u0646 \u0642\u0648\u0629 \u0627\u0644\u0628\u0627\u0643 \u0625\u0646\u062f \u0648\u062c\u0645\u0627\u0644 \u0627\u0644\u0641\u0631\u0627\u0646 \u0625\u0646\u062f \u0639\u0634\u0627\u0646 \u0623\u0637\u0644\u0639 \u0644\u0643 \u0634\u063a\u0644 \u0645\u062a\u0643\u0627\u0645\u0644 \u0648\u0645\u0638\u0628\u0648\u0637.<\/p>\r\n        <a href=\"#about\" class=\"ts-about-link\">\u0627\u0639\u0631\u0641 \u0623\u0643\u062a\u0631 <span>\u2190<\/span><\/a>\r\n        <img decoding=\"async\" class=\"ts-about-signature\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/Untitled-design-59.png\" alt=\"Tarek Seliman signature\" loading=\"lazy\">\r\n    <\/div>\r\n    \r\n    <div class=\"ts-about-timeline\">\r\n        <div class=\"ts-timeline-item\">\r\n            <div class=\"ts-timeline-icon\">\r\n                <svg viewBox=\"0 0 24 24\"><rect x=\"2\" y=\"7\" width=\"20\" height=\"14\" rx=\"2\" ry=\"2\"><\/rect><path d=\"M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16\"><\/path><\/svg>\r\n            <\/div>\r\n            <div class=\"ts-timeline-content\">\r\n                <h4>\u0645\u0637\u0648\u0631 \u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633 \u0623\u0648\u0644 <span>@ i-Valley<\/span><\/h4>\r\n                <p>\u0645\u0627\u0631\u0633 2026 \u2013 \u0644\u062d\u062f \u062f\u0644\u0648\u0642\u062a\u064a<\/p>\r\n            <\/div>\r\n        <\/div>\r\n        \r\n        <div class=\"ts-timeline-item\">\r\n            <div class=\"ts-timeline-icon\">\r\n                <svg viewBox=\"0 0 24 24\"><path d=\"M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z\"><\/path><polyline points=\"3.27 6.96 12 12.01 20.73 6.96\"><\/polyline><line x1=\"12\" y1=\"22.08\" x2=\"12\" y2=\"12\"><\/line><\/svg>\r\n            <\/div>\r\n            <div class=\"ts-timeline-content\">\r\n                <h4>\u0645\u0637\u0648\u0631 \u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633 \u0623\u0648\u0644 (\u0639\u0645\u0644 \u062d\u0631)<\/h4>\r\n                <p>2020 \u2013 \u0644\u062d\u062f \u062f\u0644\u0648\u0642\u062a\u064a<\/p>\r\n            <\/div>\r\n        <\/div>\r\n        \r\n        <div class=\"ts-timeline-item\">\r\n            <div class=\"ts-timeline-icon\">\r\n                <svg viewBox=\"0 0 24 24\"><path d=\"M22 10v6M2 10l10-5 10 5-10 5z\"><\/path><path d=\"M6 12v5c3 3 9 3 12 0v-5\"><\/path><\/svg>\r\n            <\/div>\r\n            <div class=\"ts-timeline-content\">\r\n                <h4>\u0646\u0638\u0645 \u0645\u0639\u0644\u0648\u0645\u0627\u062a \u0625\u062f\u0627\u0631\u064a\u0629 \u0648\u062d\u0627\u0633\u0628 \u0622\u0644\u064a<\/h4>\r\n                <p>\u0634\u0628\u0631\u0627 \u0627\u0644\u062e\u064a\u0645\u0629\u060c 2021<\/p>\r\n            <\/div>\r\n        <\/div>\r\n        \r\n        <div class=\"ts-timeline-item\">\r\n            <div class=\"ts-timeline-icon\">\r\n                <svg viewBox=\"0 0 24 24\"><rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"><\/rect><line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\"><\/line><line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\"><\/line><line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\"><\/line><\/svg>\r\n            <\/div>\r\n            <div class=\"ts-timeline-content\">\r\n                <h4>\u062f\u0628\u0644\u0648\u0645 \u0641\u0646\u064a \u0645\u0639\u0645\u0627\u0631\u064a (\u062a\u0634\u064a\u064a\u062f \u0648\u0628\u0646\u0627\u0621)<\/h4>\r\n                <p>\u062f\u0627\u0631 \u0627\u0644\u0633\u0644\u0627\u0645\u060c 2017<\/p>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-bb9ed08 e-con-full e-flex e-con e-parent\" data-id=\"bb9ed08\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c6fabb9 elementor-widget elementor-widget-html\" data-id=\"c6fabb9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"ts-skills-marquees\" id=\"skills\" aria-labelledby=\"ts-skills-title\" dir=\"rtl\">\r\n<style>\r\n\/* ==========================================================================\r\n   TS Skills - Premium Floating Glass Marquees (Arabic Version)\r\n   ========================================================================== *\/\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap');\r\n\r\n.ts-skills-marquees {\r\n    --skm-ink: #171421;\r\n    --skm-muted: #777489;\r\n    --skm-purple: #7955e8;\r\n    --skm-border: rgba(121, 85, 232, 0.15);\r\n    --skm-gradient: linear-gradient(135deg, #5B45C2 20%, #9b88ed 60%, #c084fc 100%);\r\n\r\n    position: relative;\r\n    width: 100%;\r\n    background: #fdfcff;\r\n    background-image: radial-gradient(ellipse at 80% 50%, rgba(235, 225, 255, 0.4) 0%, transparent 50%),\r\n                      radial-gradient(ellipse at 20% 50%, rgba(220, 206, 255, 0.3) 0%, transparent 50%); \/* \u0639\u0643\u0633\u0646\u0627 \u0627\u0644\u0646\u0633\u0628\u0629 \u0644\u0640 RTL *\/\r\n    font-family: 'IBM Plex Sans Arabic', system-ui, sans-serif;\r\n    box-sizing: border-box;\r\n    padding: clamp(60px, 8vw, 100px) 0;\r\n    overflow: hidden;\r\n    color: var(--skm-ink);\r\n}\r\n\r\n.ts-skills-marquees * { box-sizing: border-box; margin: 0; padding: 0; }\r\n\r\n.skm-container {\r\n    width: min(1200px, calc(100% - 40px));\r\n    margin: 0 auto 50px auto;\r\n    position: relative;\r\n    z-index: 2;\r\n}\r\n\r\n\/* Header Style *\/\r\n.skm-header {\r\n    border-bottom: 1px solid rgba(121, 85, 232, 0.15);\r\n    padding-bottom: 30px;\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: flex-end;\r\n    flex-wrap: wrap;\r\n    gap: 20px;\r\n}\r\n\r\n.skm-header-col {\r\n    display: flex;\r\n    flex-direction: column;\r\n}\r\n\r\n.skm-title {\r\n    font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n    font-size: clamp(2.4rem, 4vw, 3.8rem);\r\n    font-weight: 700;\r\n    line-height: 1.2;\r\n    color: var(--skm-ink);\r\n}\r\n\r\n.skm-title em {\r\n    font-style: normal; \/* \u0634\u064a\u0644\u0646\u0627 \u0627\u0644\u0645\u064a\u0644\u0627\u0646 \u0639\u0634\u0627\u0646 \u0627\u0644\u0639\u0631\u0628\u064a *\/\r\n    background: var(--skm-gradient);\r\n    color: transparent;\r\n    -webkit-background-clip: text;\r\n    background-clip: text;\r\n    display: inline-block;\r\n    font-weight: 700;\r\n}\r\n\r\n.skm-lead {\r\n    font-size: 15px;\r\n    color: var(--skm-muted);\r\n    max-width: 420px;\r\n    line-height: 1.8;\r\n}\r\n\r\n\/* ==========================================================================\r\n   Marquee Sliders Container\r\n   ========================================================================== *\/\r\n.skm-sliders-wrap {\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 20px;\r\n    width: 100vw;\r\n    position: relative;\r\n    left: 50%;\r\n    right: 50%;\r\n    margin-left: -50vw;\r\n    margin-right: -50vw;\r\n    mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);\r\n    -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);\r\n}\r\n\r\n.skm-track-rail {\r\n    display: flex;\r\n    overflow: hidden;\r\n    user-select: none;\r\n    padding: 10px 0;\r\n    direction: ltr; \/* \u062e\u0644\u064a\u0646\u0627 \u0627\u0644\u0627\u062a\u062c\u0627\u0647 \u0647\u0646\u0627 LTR \u0639\u0634\u0627\u0646 \u062d\u0631\u0643\u0629 \u0627\u0644\u0623\u0646\u064a\u0645\u064a\u0634\u0646 \u062a\u0638\u0628\u0637 100% \u0628\u0627\u0644\u0640 TranslateX *\/\r\n}\r\n\r\n.skm-track {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 16px;\r\n    width: max-content;\r\n    will-change: transform;\r\n}\r\n\r\n\/* Pause when user hovers *\/\r\n.skm-track-rail:hover .skm-track {\r\n    animation-play-state: paused !important;\r\n}\r\n\r\n\/* ==========================================================================\r\n   The Glass Badges (Pills)\r\n   ========================================================================== *\/\r\n.skm-pill {\r\n    font-family: 'IBM Plex Sans Arabic', sans-serif;\r\n    font-size: 14px;\r\n    font-weight: 500;\r\n    color: var(--skm-ink);\r\n    direction: rtl; \/* \u0646\u0631\u062c\u0639 \u0627\u0644\u0643\u0644\u0627\u0645 \u062c\u0648\u0647 \u0627\u0644\u0628\u0627\u062f\u062c \u0639\u0631\u0628\u064a \u0635\u062d *\/\r\n    \r\n    \/* Glassmorphism Effect *\/\r\n    background: rgba(255, 255, 255, 0.7);\r\n    -webkit-backdrop-filter: blur(12px);\r\n    backdrop-filter: blur(12px);\r\n    border: 1px solid rgba(255, 255, 255, 0.9);\r\n    \r\n    padding: 14px 26px;\r\n    border-radius: 50px;\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 12px;\r\n    white-space: nowrap;\r\n    \r\n    \/* Soft colored shadow *\/\r\n    box-shadow: 0 8px 25px rgba(121, 85, 232, 0.06), inset 0 0 10px rgba(255, 255, 255, 0.5);\r\n    transition: all 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);\r\n}\r\n\r\n\/* The star icon inside the pill *\/\r\n.skm-pill::before {\r\n    content: \"\u2726\";\r\n    color: var(--skm-purple);\r\n    font-size: 12px;\r\n    opacity: 0.8;\r\n    transition: transform 0.3s ease;\r\n}\r\n\r\n\/* Hover Effect on Individual Pill *\/\r\n.skm-pill:hover {\r\n    transform: translateY(-3px) scale(1.02);\r\n    border-color: var(--skm-purple);\r\n    background: rgba(255, 255, 255, 0.95);\r\n    box-shadow: 0 12px 30px rgba(121, 85, 232, 0.15);\r\n}\r\n\r\n.skm-pill:hover::before {\r\n    transform: rotate(90deg) scale(1.2);\r\n}\r\n\r\n\/* Primary Variation *\/\r\n.skm-pill.is-primary {\r\n    background: linear-gradient(135deg, rgba(255,255,255,0.9), rgba(244,239,255,0.8));\r\n    border-color: rgba(121, 85, 232, 0.3);\r\n    color: var(--skm-purple);\r\n    font-weight: 600;\r\n}\r\n\r\n\/* ==========================================================================\r\n   Animations: Left & Right\r\n   ========================================================================== *\/\r\n.skm-move-left { animation: skmScrollLeft 38s linear infinite; }\r\n.skm-move-right { animation: skmScrollRight 42s linear infinite; }\r\n.skm-move-left-alt { animation: skmScrollLeft 35s linear infinite; }\r\n\r\n@keyframes skmScrollLeft {\r\n    0% { transform: translateX(0); }\r\n    100% { transform: translateX(-50%); }\r\n}\r\n\r\n@keyframes skmScrollRight {\r\n    0% { transform: translateX(-50%); }\r\n    100% { transform: translateX(0); }\r\n}\r\n\r\n\/* Responsive *\/\r\n@media (max-width: 768px) {\r\n    .skm-pill {\r\n        font-size: 13px;\r\n        padding: 10px 20px;\r\n    }\r\n    .skm-sliders-wrap {\r\n        gap: 12px;\r\n    }\r\n    .skm-title {\r\n        font-size: 2.2rem;\r\n    }\r\n}\r\n<\/style>\r\n\r\n<div class=\"skm-container\">\r\n    <!-- Header -->\r\n    <header class=\"skm-header\">\r\n        <div class=\"skm-header-col\">\r\n            <h2 class=\"skm-title\" id=\"ts-skills-title\">\u0623\u0647\u0645 \u0627\u0644\u0645\u0647\u0627\u0631\u0627\u062a \u0648 <em>\u0627\u0644\u062a\u0642\u0646\u064a\u0627\u062a<\/em><\/h2>\r\n        <\/div>\r\n        <p class=\"skm-lead\">\r\n            \u062a\u0642\u0646\u064a\u0627\u062a \u0645\u062a\u062c\u0631\u0628\u0629 \u0641\u064a \u0627\u0644\u0634\u063a\u0644 \u0627\u0644\u062a\u0642\u064a\u0644\u060c \u0645\u0646 \u0623\u0648\u0644 \u0647\u0646\u062f\u0633\u0629 \u062a\u0637\u0628\u064a\u0642\u0627\u062a \u0627\u0644\u0648\u064a\u0628 \u0627\u0644\u0645\u062e\u0635\u0635\u0629\u060c \u0644\u0625\u062f\u0627\u0631\u0629 \u0633\u064a\u0631\u0641\u0631\u0627\u062a \u0644\u064a\u0646\u0643\u0633\u060c \u0644\u0644\u0623\u0646\u0638\u0645\u0629 \u0627\u0644\u0644\u064a \u0628\u062a\u0633\u062a\u062d\u0645\u0644 \u0636\u063a\u0637 \u0639\u0627\u0644\u064a.\r\n        <\/p>\r\n    <\/header>\r\n<\/div>\r\n\r\n<!-- 3 Full-Width Directional Sliders -->\r\n<div class=\"skm-sliders-wrap\">\r\n    \r\n    <!-- SLIDER 01: Moves to LEFT -->\r\n    <div class=\"skm-track-rail\">\r\n        <div class=\"skm-track skm-move-left\">\r\n            <span class=\"skm-pill is-primary\">\u0647\u0646\u062f\u0633\u0629 \u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633<\/span>\r\n            <span class=\"skm-pill\">\u062a\u0637\u0648\u064a\u0631 \u0648\u062a\u0648\u0633\u064a\u0639 \u0648\u0648\u0643\u0648\u0645\u0631\u0633<\/span>\r\n            <span class=\"skm-pill\">\u0634\u0648\u0628\u064a\u0641\u0627\u064a \u0644\u064a\u0643\u0648\u064a\u062f<\/span>\r\n            <span class=\"skm-pill\">\u0628\u0631\u0645\u062c\u0629 PHP \u0648 OOP<\/span>\r\n            <span class=\"skm-pill is-primary\">\u0628\u0646\u0627\u0621 \u0648\u062a\u0635\u0645\u064a\u0645 REST API<\/span>\r\n            <span class=\"skm-pill\">JavaScript (ES6+)<\/span>\r\n            <span class=\"skm-pill\">\u0628\u0627\u064a\u062b\u0648\u0646 Automation<\/span>\r\n            <span class=\"skm-pill\">React.js \u0648 Next.js<\/span>\r\n            <span class=\"skm-pill\">\u0625\u0637\u0627\u0631 \u0639\u0645\u0644 Vue.js<\/span>\r\n            <span class=\"skm-pill\">\u062a\u0637\u0628\u064a\u0642\u0627\u062a \u0641\u0644\u0627\u062a\u0631 (Flutter)<\/span>\r\n            <span class=\"skm-pill\">\u0645\u0639\u0627\u064a\u064a\u0631 HTML5<\/span>\r\n            <span class=\"skm-pill\">\u0647\u064a\u0643\u0644\u0629 CSS3<\/span>\r\n            <!-- Duplicate for infinite loop -->\r\n            <span class=\"skm-pill is-primary\">\u0647\u0646\u062f\u0633\u0629 \u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633<\/span>\r\n            <span class=\"skm-pill\">\u062a\u0637\u0648\u064a\u0631 \u0648\u062a\u0648\u0633\u064a\u0639 \u0648\u0648\u0643\u0648\u0645\u0631\u0633<\/span>\r\n            <span class=\"skm-pill\">\u0634\u0648\u0628\u064a\u0641\u0627\u064a \u0644\u064a\u0643\u0648\u064a\u062f<\/span>\r\n            <span class=\"skm-pill\">\u0628\u0631\u0645\u062c\u0629 PHP \u0648 OOP<\/span>\r\n            <span class=\"skm-pill is-primary\">\u0628\u0646\u0627\u0621 \u0648\u062a\u0635\u0645\u064a\u0645 REST API<\/span>\r\n            <span class=\"skm-pill\">JavaScript (ES6+)<\/span>\r\n            <span class=\"skm-pill\">\u0628\u0627\u064a\u062b\u0648\u0646 Automation<\/span>\r\n            <span class=\"skm-pill\">React.js \u0648 Next.js<\/span>\r\n            <span class=\"skm-pill\">\u0625\u0637\u0627\u0631 \u0639\u0645\u0644 Vue.js<\/span>\r\n            <span class=\"skm-pill\">\u062a\u0637\u0628\u064a\u0642\u0627\u062a \u0641\u0644\u0627\u062a\u0631 (Flutter)<\/span>\r\n            <span class=\"skm-pill\">\u0645\u0639\u0627\u064a\u064a\u0631 HTML5<\/span>\r\n            <span class=\"skm-pill\">\u0647\u064a\u0643\u0644\u0629 CSS3<\/span>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <!-- SLIDER 02: Moves to RIGHT -->\r\n    <div class=\"skm-track-rail\">\r\n        <div class=\"skm-track skm-move-right\">\r\n            <span class=\"skm-pill is-primary\">\u0625\u062f\u0627\u0631\u0629 \u0633\u064a\u0631\u0641\u0631\u0627\u062a \u0644\u064a\u0646\u0643\u0633<\/span>\r\n            <span class=\"skm-pill\">AlmaLinux \u0648 RockyLinux<\/span>\r\n            <span class=\"skm-pill\">Nginx Reverse Proxy<\/span>\r\n            <span class=\"skm-pill\">\u0623\u062f\u0627\u0621 Apache \u0648 PHP-FPM<\/span>\r\n            <span class=\"skm-pill is-primary\">\u062d\u0627\u0648\u064a\u0627\u062a Docker<\/span>\r\n            <span class=\"skm-pill\">\u0644\u0648\u062d\u0629 \u062a\u062d\u0643\u0645 CWP7<\/span>\r\n            <span class=\"skm-pill\">cPanel \u0648 WHM<\/span>\r\n            <span class=\"skm-pill\">\u0627\u0633\u062a\u0636\u0627\u0641\u0629 \u0630\u0627\u062a\u064a\u0629 \u0628\u0640 Coolify<\/span>\r\n            <span class=\"skm-pill\">\u0633\u064a\u0631\u0641\u0631\u0627\u062a Hetzner<\/span>\r\n            <span class=\"skm-pill\">\u0645\u062c\u0645\u0648\u0639\u0627\u062a Contabo VPS<\/span>\r\n            <span class=\"skm-pill\">Cloudflare DNS \u0648\u062d\u0645\u0627\u064a\u0629 WAF<\/span>\r\n            <span class=\"skm-pill\">\u0634\u063a\u0644 \u0627\u0644\u062a\u064a\u0631\u0645\u064a\u0646\u0627\u0644 (SSH \u0648 WP-CLI)<\/span>\r\n            <!-- Duplicate for infinite loop -->\r\n            <span class=\"skm-pill is-primary\">\u0625\u062f\u0627\u0631\u0629 \u0633\u064a\u0631\u0641\u0631\u0627\u062a \u0644\u064a\u0646\u0643\u0633<\/span>\r\n            <span class=\"skm-pill\">AlmaLinux \u0648 RockyLinux<\/span>\r\n            <span class=\"skm-pill\">Nginx Reverse Proxy<\/span>\r\n            <span class=\"skm-pill\">\u0623\u062f\u0627\u0621 Apache \u0648 PHP-FPM<\/span>\r\n            <span class=\"skm-pill is-primary\">\u062d\u0627\u0648\u064a\u0627\u062a Docker<\/span>\r\n            <span class=\"skm-pill\">\u0644\u0648\u062d\u0629 \u062a\u062d\u0643\u0645 CWP7<\/span>\r\n            <span class=\"skm-pill\">cPanel \u0648 WHM<\/span>\r\n            <span class=\"skm-pill\">\u0627\u0633\u062a\u0636\u0627\u0641\u0629 \u0630\u0627\u062a\u064a\u0629 \u0628\u0640 Coolify<\/span>\r\n            <span class=\"skm-pill\">\u0633\u064a\u0631\u0641\u0631\u0627\u062a Hetzner<\/span>\r\n            <span class=\"skm-pill\">\u0645\u062c\u0645\u0648\u0639\u0627\u062a Contabo VPS<\/span>\r\n            <span class=\"skm-pill\">Cloudflare DNS \u0648\u062d\u0645\u0627\u064a\u0629 WAF<\/span>\r\n            <span class=\"skm-pill\">\u0634\u063a\u0644 \u0627\u0644\u062a\u064a\u0631\u0645\u064a\u0646\u0627\u0644 (SSH \u0648 WP-CLI)<\/span>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <!-- SLIDER 03: Moves to LEFT -->\r\n    <div class=\"skm-track-rail\">\r\n        <div class=\"skm-track skm-move-left-alt\">\r\n            <span class=\"skm-pill is-primary\">\u0628\u0648\u0627\u0628\u0627\u062a \u0627\u0644\u062f\u0641\u0639 \u0648 Paymob<\/span>\r\n            <span class=\"skm-pill\">\u0623\u0646\u0638\u0645\u0629 \u062d\u0633\u0627\u0628 \u0634\u062d\u0646 \u0645\u062e\u0635\u0635\u0629<\/span>\r\n            <span class=\"skm-pill\">\u062a\u062d\u0633\u064a\u0646 \u0642\u0648\u0627\u0639\u062f \u0628\u064a\u0627\u0646\u0627\u062a MySQL<\/span>\r\n            <span class=\"skm-pill\">\u0642\u0648\u0627\u0639\u062f \u0628\u064a\u0627\u0646\u0627\u062a PostgreSQL<\/span>\r\n            <span class=\"skm-pill is-primary\">\u0633\u0631\u0639\u0629 \u0627\u0644\u0645\u0648\u0627\u0642\u0639 (PageSpeed 90+)<\/span>\r\n            <span class=\"skm-pill\">\u0628\u0646\u064a\u0629 \u0623\u0646\u0638\u0645\u0629 SaaS<\/span>\r\n            <span class=\"skm-pill\">\u0646\u0642\u0644 \u0633\u064a\u0631\u0641\u0631\u0627\u062a \u0628\u062f\u0648\u0646 \u062a\u0648\u0642\u0641<\/span>\r\n            <span class=\"skm-pill\">\u0641\u062d\u0635 \u0648\u062a\u0623\u0645\u064a\u0646 \u0627\u0644\u0645\u0648\u0627\u0642\u0639<\/span>\r\n            <span class=\"skm-pill\">\u0646\u0638\u0627\u0645 \u0646\u0633\u062e \u0627\u062d\u062a\u064a\u0627\u0637\u064a (Backups)<\/span>\r\n            <span class=\"skm-pill\">\u0625\u062f\u0627\u0631\u0629 Namecheap \u0648 DNS<\/span>\r\n            <span class=\"skm-pill\">\u0627\u0633\u062a\u0636\u0627\u0641\u0627\u062a Bluehost \u0648 InMotion<\/span>\r\n            <span class=\"skm-pill\">\u0625\u0639\u062f\u0627\u062f \u0625\u064a\u0645\u064a\u0644\u0627\u062a \u0627\u0644\u0634\u0631\u0643\u0627\u062a (Zoho)<\/span>\r\n            <!-- Duplicate for infinite loop -->\r\n            <span class=\"skm-pill is-primary\">\u0628\u0648\u0627\u0628\u0627\u062a \u0627\u0644\u062f\u0641\u0639 \u0648 Paymob<\/span>\r\n            <span class=\"skm-pill\">\u0623\u0646\u0638\u0645\u0629 \u062d\u0633\u0627\u0628 \u0634\u062d\u0646 \u0645\u062e\u0635\u0635\u0629<\/span>\r\n            <span class=\"skm-pill\">\u062a\u062d\u0633\u064a\u0646 \u0642\u0648\u0627\u0639\u062f \u0628\u064a\u0627\u0646\u0627\u062a MySQL<\/span>\r\n            <span class=\"skm-pill\">\u0642\u0648\u0627\u0639\u062f \u0628\u064a\u0627\u0646\u0627\u062a PostgreSQL<\/span>\r\n            <span class=\"skm-pill is-primary\">\u0633\u0631\u0639\u0629 \u0627\u0644\u0645\u0648\u0627\u0642\u0639 (PageSpeed 90+)<\/span>\r\n            <span class=\"skm-pill\">\u0628\u0646\u064a\u0629 \u0623\u0646\u0638\u0645\u0629 SaaS<\/span>\r\n            <span class=\"skm-pill\">\u0646\u0642\u0644 \u0633\u064a\u0631\u0641\u0631\u0627\u062a \u0628\u062f\u0648\u0646 \u062a\u0648\u0642\u0641<\/span>\r\n            <span class=\"skm-pill\">\u0641\u062d\u0635 \u0648\u062a\u0623\u0645\u064a\u0646 \u0627\u0644\u0645\u0648\u0627\u0642\u0639<\/span>\r\n            <span class=\"skm-pill\">\u0646\u0638\u0627\u0645 \u0646\u0633\u062e \u0627\u062d\u062a\u064a\u0627\u0637\u064a (Backups)<\/span>\r\n            <span class=\"skm-pill\">\u0625\u062f\u0627\u0631\u0629 Namecheap \u0648 DNS<\/span>\r\n            <span class=\"skm-pill\">\u0627\u0633\u062a\u0636\u0627\u0641\u0627\u062a Bluehost \u0648 InMotion<\/span>\r\n            <span class=\"skm-pill\">\u0625\u0639\u062f\u0627\u062f \u0625\u064a\u0645\u064a\u0644\u0627\u062a \u0627\u0644\u0634\u0631\u0643\u0627\u062a (Zoho)<\/span>\r\n        <\/div>\r\n    <\/div>\r\n\r\n<\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d23ed74 e-con-full e-flex e-con e-parent\" data-id=\"d23ed74\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3f2aa3c elementor-widget elementor-widget-html\" data-id=\"3f2aa3c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\n    <link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@11\/swiper-bundle.min.css\" \/>\n    <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/swiper@11\/swiper-bundle.min.js\"><\/script>\n\n    <style>\n    @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600&family=Playfair+Display:ital,wght@0,600;1,600&display=swap');\n    \n    .ts-slider-section {\n        --ts-ink: #171421; --ts-muted: #666375; --ts-purple: #7955e8; --ts-purple-light: #f4efff; --ts-border: #eae5f5;\n        font-family: 'Inter', system-ui, sans-serif; color: var(--ts-ink);\n        background: linear-gradient(180deg, #ffffff 0%, #f4efff 100%);\n        width: 100% !important;\n        padding: 80px 0 60px;\n        box-sizing: border-box; \n        overflow: hidden;\n    }\n    .ts-slider-section * { box-sizing: border-box !important; }\n    \n    .ts-slider-header { \n        display: flex; justify-content: space-between; align-items: flex-end; \n        margin-bottom: 40px; max-width: 1400px; margin-inline: auto; padding: 0 4%;\n    }\n    .ts-slider-title { font-family: 'Playfair Display', serif; font-size: clamp(32px, 4vw, 42px); font-weight: 600; margin: 0 0 10px; letter-spacing: -0.5px; }\n    .ts-slider-title em { color: var(--ts-purple); font-style: italic; }\n    .ts-slider-desc { font-size: 16px; color: var(--ts-muted); margin: 0; max-width: 500px; line-height: 1.5; }\n    \n    .ts-view-all-btn {\n        display: inline-flex; align-items: center; gap: 8px; background: var(--ts-ink); color: #fff !important;\n        padding: 12px 24px; border-radius: 50px; font-size: 14px; font-weight: 600; text-decoration: none !important;\n        transition: all 0.3s ease; white-space: nowrap;\n    }\n    .ts-view-all-btn:hover { background: var(--ts-purple); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(121, 85, 232, 0.2); }\n\n    \/* \u062d\u0627\u0648\u064a\u0629 \u0627\u0644\u0633\u0644\u0627\u064a\u062f\u0631 \u0627\u0644\u062e\u0627\u0631\u062c\u064a\u0629 *\/\n    .ts-slider-outer {\n        position: relative;\n        max-width: 1500px;\n        margin: 0 auto;\n        padding: 0 60px;\n    }\n\n    \/* Swiper Container *\/\n    .ts-swiper-container { \n        width: 100%;\n        overflow: hidden !important;\n        padding-bottom: 50px !important;\n    }\n    \n    \/* \u0627\u0644\u062a\u0639\u062f\u064a\u0644 \u0627\u0644\u0623\u0647\u0645: \u0625\u062c\u0628\u0627\u0631 \u0627\u0644\u0639\u0646\u0627\u0635\u0631 \u0639\u0644\u0649 \u0623\u062e\u0630 \u0646\u0641\u0633 \u0627\u0644\u0627\u0631\u062a\u0641\u0627\u0639 *\/\n    .ts-swiper-wrapper { \n        display: flex; \n        align-items: stretch; \/* \u064a\u0645\u062f\u062f \u0643\u0644 \u0627\u0644\u0633\u0644\u0627\u064a\u062f\u0632 \u0644\u0646\u0641\u0633 \u0627\u0644\u0637\u0648\u0644 *\/\n    }\n    .ts-swiper-container .swiper-slide {\n        height: auto !important; \/* \u0625\u0644\u063a\u0627\u0621 \u0627\u0644\u0637\u0648\u0644 \u0627\u0644\u0627\u0641\u062a\u0631\u0627\u0636\u064a \u0644\u0644\u0633\u0648\u0627\u064a\u0628\u0631 *\/\n        display: flex;\n    }\n    \n    \/* Card Styling *\/\n    .ts-slider-card {\n        background: #fff; border: 1px solid var(--ts-border); border-radius: 20px; overflow: hidden;\n        box-shadow: 0 5px 20px rgba(20, 17, 31, 0.03); display: flex; flex-direction: column; \n        width: 100%; \/* \u064a\u0627\u062e\u062f \u0643\u0627\u0645\u0644 \u0639\u0631\u0636 \u0627\u0644\u0633\u0644\u0627\u064a\u062f *\/\n        height: 100%; \/* \u064a\u0627\u062e\u062f \u0643\u0627\u0645\u0644 \u0637\u0648\u0644 \u0627\u0644\u0633\u0644\u0627\u064a\u062f *\/\n        transition: transform 0.3s ease, box-shadow 0.3s ease;\n    }\n    .ts-slider-card:hover { transform: translateY(-5px); box-shadow: 0 15px 35px rgba(121, 85, 232, 0.1); border-color: rgba(121, 85, 232, 0.3); }\n    \n    .ts-slider-img { position: relative; width: 100%; aspect-ratio: 16\/10; overflow: hidden; background: #f4efff; display: block; flex-shrink: 0; }\n    .ts-slider-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }\n    .ts-slider-card:hover .ts-slider-img img { transform: scale(1.05); }\n    .ts-slider-img.no-img { background: linear-gradient(135deg, #f4efff, #e8deff); display: flex; align-items: center; justify-content: center; }\n    .ts-slider-img.no-img svg { width: 48px; height: 48px; color: var(--ts-purple); opacity: 0.5; }\n    \n    .ts-slider-cat { position: absolute; top: 15px; left: 15px; background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(5px); color: var(--ts-purple); padding: 6px 14px; border-radius: 50px; font-size: 11px; font-weight: 700; text-transform: uppercase; z-index: 2; }\n    \n    \/* \u0627\u0644\u0643\u0648\u0646\u062a\u0646\u062a *\/\n    .ts-slider-content { \n        padding: 25px; \n        display: flex; \n        flex-direction: column; \n        flex-grow: 1; \/* \u064a\u062e\u0644\u064a \u0627\u0644\u0643\u0648\u0646\u062a\u0646\u062a \u064a\u0627\u062e\u062f \u0627\u0644\u0645\u0633\u0627\u062d\u0629 \u0627\u0644\u0628\u0627\u0642\u064a\u0629 *\/\n    }\n    .ts-slider-meta { display: flex; align-items: center; gap: 15px; font-size: 12px; color: var(--ts-muted); margin-bottom: 12px; font-weight: 500; }\n    .ts-slider-meta span { display: flex; align-items: center; gap: 6px; }\n    .ts-slider-meta svg { width: 14px; height: 14px; }\n    \n    .ts-slider-card-title { font-family: 'Playfair Display', serif; font-size: 20px; font-weight: 600; line-height: 1.3; margin: 0 0 12px; }\n    .ts-slider-card-title a { color: var(--ts-ink) !important; text-decoration: none !important; transition: color 0.3s ease; }\n    .ts-slider-card-title a:hover { color: var(--ts-purple) !important; }\n    \n    \/* \u0627\u0644\u0648\u0635\u0641 \u064a\u0627\u062e\u062f \u0645\u0633\u0627\u062d\u0629 \u0639\u0634\u0627\u0646 \u064a\u0632\u0642 \u0627\u0644\u0632\u0631\u0627\u0631 \u0644\u062a\u062d\u062a *\/\n    .ts-slider-excerpt { \n        font-size: 14px; color: var(--ts-muted); line-height: 1.6; margin: 0 0 20px; \n        flex-grow: 1; \/* \u0647\u0630\u0627 \u0627\u0644\u0633\u0637\u0631 \u0647\u0648 \u0627\u0644\u0644\u064a \u0628\u064a\u0632\u0642 \u0632\u0631\u0627\u0631 \"Read Article\" \u0644\u062a\u062d\u062a *\/\n    }\n    \n    .ts-slider-link { \n        display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; \n        color: var(--ts-purple) !important; text-decoration: none !important; \n        transition: gap 0.3s ease;\n        margin-top: auto; \/* \u064a\u0636\u0645\u0646 \u0625\u0646 \u0627\u0644\u0632\u0631\u0627\u0631 \u062f\u0627\u064a\u0645\u0627\u064b \u0641\u064a \u0627\u0644\u0622\u062e\u0631 *\/\n        align-self: flex-start; \/* \u0639\u0634\u0627\u0646 \u0627\u0644\u0632\u0631\u0627\u0631 \u0645\u064a\u0645\u062f\u062f\u0634 \u0627\u0644\u0639\u0631\u0636 *\/\n    }\n    .ts-slider-link:hover { gap: 10px; }\n\n    \/* Custom Outside Arrows *\/\n    .ts-arrow-prev, .ts-arrow-next {\n        position: absolute; top: 50%; transform: translateY(-50%);\n        width: 50px; height: 50px; background: #fff; border-radius: 50%;\n        box-shadow: 0 5px 20px rgba(121, 85, 232, 0.15); color: var(--ts-purple);\n        border: 1px solid var(--ts-border); display: flex; align-items: center; justify-content: center;\n        cursor: pointer; z-index: 10; transition: all 0.3s ease;\n    }\n    .ts-arrow-prev { left: 0; }\n    .ts-arrow-next { right: 0; }\n    .ts-arrow-prev:hover, .ts-arrow-next:hover { background: var(--ts-purple); color: #fff; border-color: var(--ts-purple); }\n    \n    \/* Swiper Custom Pagination *\/\n    .swiper-pagination-bullet { background: var(--ts-muted) !important; opacity: 0.3 !important; }\n    .swiper-pagination-bullet-active { background: var(--ts-purple) !important; opacity: 1 !important; width: 24px !important; border-radius: 4px !important; }\n\n    \/* Responsive *\/\n    @media (max-width: 1024px) {\n        .ts-slider-outer { padding: 0 40px; }\n    }\n    @media (max-width: 900px) {\n        .ts-slider-header { flex-direction: column; align-items: flex-start; gap: 20px; }\n        .ts-arrow-prev, .ts-arrow-next { display: none !important; }\n        .ts-slider-outer { padding: 0 4%; }\n    }\n    <\/style>\n\n    <div class=\"ts-slider-section\">\n        <div class=\"ts-slider-header\">\n            <div>\n                <h2 class=\"ts-slider-title\">Latest <em>Insights<\/em><\/h2>\n                <p class=\"ts-slider-desc\">Explore my latest thoughts on WordPress, Shopify, and building high-performance digital systems.<\/p>\n            <\/div>\n            <a href=\"https:\/\/tarekseliman.com\/insights\/\" class=\"ts-view-all-btn\">View All Articles <span>\u2192<\/span><\/a>\n        <\/div>\n\n        <div class=\"ts-slider-outer\">\n            <div class=\"swiper ts-swiper-container\">\n                <div class=\"swiper-wrapper\">\n                                            <!-- Swiper Slide -->\n                        <div class=\"swiper-slide\">\n                            <article class=\"ts-slider-card\">\n                                <a href=\"https:\/\/tarekseliman.com\/ar\/5-quick-wins-to-speed-up-your-wordpress-site\/\" class=\"ts-slider-img \">\n                                                                            <img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"447\" src=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/93da22ae-412c-4f41-a3b8-78787152ddb7.jpg\" class=\"attachment-large size-large wp-post-image\" alt=\"5 \u062d\u0627\u062c\u0627\u062a \u0633\u0631\u064a\u0639\u0629 \u062a\u0638\u0628\u0637 \u0628\u064a\u0647\u0627 \u0633\u0631\u0639\u0629 \u0645\u0648\u0642\u0639\u0643 \u0639\u0644\u0649 \u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633\" srcset=\"https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/93da22ae-412c-4f41-a3b8-78787152ddb7.jpg 1024w, https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/93da22ae-412c-4f41-a3b8-78787152ddb7-300x168.jpg 300w, https:\/\/tarekseliman.com\/wp-content\/uploads\/2026\/10\/93da22ae-412c-4f41-a3b8-78787152ddb7-768x429.jpg 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>                                                                        <span class=\"ts-slider-cat\">Security<\/span>\n                                <\/a>\n                                <div class=\"ts-slider-content\">\n                                    <div class=\"ts-slider-meta\">\n                                        <span><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\"><\/rect><line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\"><\/line><line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\"><\/line><line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\"><\/line><\/svg> \u0623\u0643\u062a\u0648\u0628\u0631 27, 2026<\/span>\n                                        <span><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><circle cx=\"12\" cy=\"12\" r=\"10\"><\/circle><polyline points=\"12 6 12 12 16 14\"><\/polyline><\/svg> 5 min<\/span>\n                                    <\/div>\n                                    <h3 class=\"ts-slider-card-title\"><a href=\"https:\/\/tarekseliman.com\/ar\/5-quick-wins-to-speed-up-your-wordpress-site\/\">5 \u062d\u0627\u062c\u0627\u062a \u0633\u0631\u064a\u0639\u0629 \u062a\u0638\u0628\u0637 \u0628\u064a\u0647\u0627 \u0633\u0631\u0639\u0629 \u0645\u0648\u0642\u0639\u0643 \u0639\u0644\u0649 \u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633<\/a><\/h3>\n                                    <p class=\"ts-slider-excerpt\">Performance \/ WordPress 5 Quick Wins to Speed Up Your WordPress Site...<\/p>\n                                    <a href=\"https:\/\/tarekseliman.com\/ar\/5-quick-wins-to-speed-up-your-wordpress-site\/\" class=\"ts-slider-link\">Read Article <span>\u2192<\/span><\/a>\n                                <\/div>\n                            <\/article>\n                        <\/div>\n                                    <\/div>\n                \n                <div class=\"swiper-pagination\"><\/div>\n            <\/div>\n\n            <div class=\"ts-arrow-prev\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"15 18 9 12 15 6\"><\/polyline><\/svg>\n            <\/div>\n            <div class=\"ts-arrow-next\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"9 18 15 12 9 6\"><\/polyline><\/svg>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <script>\n    document.addEventListener(\"DOMContentLoaded\", function() {\n        if (typeof Swiper !== 'undefined') {\n            new Swiper('.ts-swiper-container', {\n                slidesPerView: 1,\n                spaceBetween: 30,\n                loop: true, \n                autoplay: {\n                    delay: 5000, \n                    disableOnInteraction: false, \n                },\n                navigation: {\n                    nextEl: '.ts-arrow-next', \n                    prevEl: '.ts-arrow-prev', \n                },\n                pagination: {\n                    el: '.swiper-pagination',\n                    clickable: true,\n                },\n                breakpoints: {\n                    768: { slidesPerView: 2, spaceBetween: 30 },\n                    1024: { slidesPerView: 3, spaceBetween: 30 }\n                }\n            });\n        }\n    });\n    <\/script>\n    \t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u062e\u0628\u064a\u0631 \u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633 \u0648\u0634\u0648\u0628\u064a\u0641\u0627\u064a \u0637\u0627\u0631\u0642 \u0633\u0644\u064a\u0645\u0627\u0646.\u0628\u0628\u0646\u064a \u0623\u0646\u0638\u0645\u0629\u0631\u0642\u0645\u064a\u0629. \u0623\u0646\u0627 \u0645\u0637\u0648\u0631 \u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633 \u0648\u0634\u0648\u0628\u064a\u0641\u0627\u064a \u062e\u0628\u0631\u062a\u064a \u0623\u0643\u062a\u0631 \u0645\u0646 11 \u0633\u0646\u0629\u060c \u0628\u0633\u0627\u0639\u062f \u0627\u0644\u0634\u0631\u0643\u0627\u062a \u062a\u0639\u0645\u0644 \u0645\u0648\u0627\u0642\u0639 \u0648\u0645\u062a\u0627\u062c\u0631 \u0625\u0644\u0643\u062a\u0631\u0648\u0646\u064a\u0629 \u0633\u0631\u064a\u0639\u0629\u060c \u0645\u062a\u0623\u0645\u0646\u0629 \u0635\u062d\u060c \u0648\u0645\u0633\u062a\u0639\u062f\u0629 \u062a\u0643\u0628\u0631 \u0645\u0639\u0627\u0647\u0645. \u0634\u0648\u0641 \u0623\u0639\u0645\u0627\u0644\u064a \u2190 \u064a\u0644\u0627 \u0646\u062a\u0643\u0644\u0645 \u2196 \u0645\u0624\u0633\u0633 WP Mattab\u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633 \u0648\u0641\u0631\u064a\u0644\u0627\u0646\u0633 Raven X\u0645\u0648\u0627\u0642\u0639 \u0648\u0623\u0646\u0638\u0645\u0629 \u0631\u0642\u0645\u064a\u0629 +220\u0645\u0648\u0642\u0639 +120\u0639\u0645\u064a\u0644 +11\u0633\u0646\u0629 \u062a\u0637\u0648\u064a\u0631 \u0648\u0648\u0631\u062f\u0628\u0631\u064a\u0633 \u0648\u0648\u0643\u0648\u0645\u0631\u0633 \u0634\u0648\u0628\u064a\u0641\u0627\u064a \u0644\u064a\u0643\u0648\u064a\u062f \u0628\u0631\u0645\u062c\u0629 PHP \u0631\u0628\u0637 API \u0628\u0648\u0627\u0628\u0627\u062a \u0627\u0644\u062f\u0641\u0639 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-921","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tarekseliman.com\/ar\/wp-json\/wp\/v2\/pages\/921","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tarekseliman.com\/ar\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tarekseliman.com\/ar\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tarekseliman.com\/ar\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tarekseliman.com\/ar\/wp-json\/wp\/v2\/comments?post=921"}],"version-history":[{"count":12,"href":"https:\/\/tarekseliman.com\/ar\/wp-json\/wp\/v2\/pages\/921\/revisions"}],"predecessor-version":[{"id":937,"href":"https:\/\/tarekseliman.com\/ar\/wp-json\/wp\/v2\/pages\/921\/revisions\/937"}],"wp:attachment":[{"href":"https:\/\/tarekseliman.com\/ar\/wp-json\/wp\/v2\/media?parent=921"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}