{"id":91,"date":"2026-07-21T15:57:31","date_gmt":"2026-07-21T15:57:31","guid":{"rendered":"https:\/\/alrafeigroup.com\/?page_id=91"},"modified":"2026-07-21T17:30:21","modified_gmt":"2026-07-21T17:30:21","slug":"%d9%85%d9%86-%d9%86%d8%ad%d9%86","status":"publish","type":"page","link":"https:\/\/alrafeigroup.com\/en\/%d9%85%d9%86-%d9%86%d8%ad%d9%86\/","title":{"rendered":"\u0645\u0646 \u0646\u062d\u0646"},"content":{"rendered":"<p><!-- \u0645\u0646 \u0646\u062d\u0646 -->\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Almarai:wght@300;400;700;800&#038;display=swap\" rel=\"stylesheet\">\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.7.2\/css\/all.min.css\">\n<section id=\"arf-about-hero\" dir=\"rtl\" aria-labelledby=\"arf-about-hero-title\">\n    <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1497366754035-f200968a6e72?auto=format&#038;fit=crop&#038;w=2000&#038;q=88\" alt=\"\" loading=\"eager\" fetchpriority=\"high\"><br \/>\n    ABOUT<\/p>\n<nav aria-label=\"\u0645\u0633\u0627\u0631 \u0627\u0644\u0635\u0641\u062d\u0629\">\n          <a href=\"\/en\/\">\u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629<\/a><br \/>\n          \u0645\u0646 \u0646\u062d\u0646<br \/>\n        <\/nav>\n<p>          <strong>\u0645\u062c\u0645\u0648\u0639\u0629 \u0627\u0644\u0631\u0641\u0627\u0639\u064a \u0627\u0644\u0642\u0627\u0646\u0648\u0646\u064a\u0629<\/strong><\/p>\n<h1 id=\"arf-about-hero-title\">\u0645\u0646 \u0646\u062d\u0646<\/h1>\n<p>\n          \u062e\u0628\u0631\u0629 \u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u0631\u0627\u0633\u062e\u0629\u060c<br \/>\n          \u0628\u0631\u0624\u064a\u0629 \u0645\u0639\u0627\u0635\u0631\u0629\n        <\/p>\n<p>\u0645\u062c\u0645\u0648\u0639\u0629 \u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u0633\u0639\u0648\u062f\u064a\u0629 \u062a\u0642\u062f\u0645 \u062e\u062f\u0645\u0627\u062a\u0647\u0627 \u0648\u0641\u0642 \u0645\u0646\u0647\u062c \u0645\u0647\u0646\u064a \u064a\u062c\u0645\u0639 \u0628\u064a\u0646 \u0639\u0645\u0642 \u0627\u0644\u062e\u0628\u0631\u0629\u060c \u0648\u062f\u0642\u0629 \u0627\u0644\u062a\u062d\u0644\u064a\u0644\u060c \u0648\u0641\u0647\u0645 \u0627\u062d\u062a\u064a\u0627\u062c\u0627\u062a \u0627\u0644\u0639\u0645\u0644\u0627\u0621 \u0648\u0627\u0644\u0642\u0637\u0627\u0639\u0627\u062a \u0627\u0644\u0645\u062e\u062a\u0644\u0641\u0629.<\/p>\n<p>          <a href=\"#arf-about-content\"><br \/>\n            \u0627\u0643\u062a\u0634\u0641 \u0642\u0635\u062a\u0646\u0627<br \/>\n          <\/a><br \/>\n          <a href=\"\/en\/#arf-contact-form\"><br \/>\n            \u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627<br \/>\n          <\/a><\/p>\n<aside>\n          \u0639\u0646 \u0627\u0644\u0645\u062c\u0645\u0648\u0639\u0629<br \/>\n          <strong>01<\/strong><br \/>\n          <small>\u062d\u0636\u0648\u0631 \u0645\u0647\u0646\u064a \u0645\u0648\u062b\u0648\u0642<\/small><\/p>\n<h2>\u062e\u0628\u0631\u0629 \u062a\u0633\u062a\u0646\u062f \u0625\u0644\u0649 \u0627\u0644\u0645\u0647\u0646\u064a\u0629 \u0648\u0627\u0644\u062b\u0642\u0629<\/h2>\n<p>\u0646\u0639\u0645\u0644 \u0639\u0644\u0649 \u062a\u0642\u062f\u064a\u0645 \u062d\u0644\u0648\u0644 \u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u0648\u0627\u0636\u062d\u0629 \u0648\u0645\u062a\u0648\u0627\u0632\u0646\u0629\u060c \u0645\u0639 \u0627\u0644\u0627\u0644\u062a\u0632\u0627\u0645 \u0628\u0623\u0639\u0644\u0649 \u0645\u0639\u0627\u064a\u064a\u0631 \u0627\u0644\u0645\u0647\u0646\u064a\u0629 \u0648\u0627\u0644\u0639\u0646\u0627\u064a\u0629 \u0628\u062a\u0641\u0627\u0635\u064a\u0644 \u0643\u0644 \u0645\u0633\u0623\u0644\u0629.<\/p>\n<p>        <i><\/i><br \/>\n      <\/aside>\n<p>      <a href=\"#arf-about-content\"><br \/>\n        \u0645\u0631\u0651\u0631 \u0644\u0627\u0633\u062a\u0643\u0634\u0627\u0641 \u0627\u0644\u0635\u0641\u062d\u0629<br \/>\n      <\/a><br \/>\n        <strong>ALRAFEI GROUP<\/strong><br \/>\n        <small>LEGAL EXPERIENCE<\/small><br \/>\n  <i><\/i><br \/>\n<\/section>\n<p><!-- \u0627\u062c\u0639\u0644 \u0623\u0648\u0644 \u0633\u0643\u0634\u0646 \u0628\u0639\u062f \u0627\u0644\u0647\u064a\u0631\u0648 \u064a\u062d\u0645\u0644 \u0647\u0630\u0627 \u0627\u0644\u0645\u0639\u0631\u0651\u0641 --><\/p>\n<style>\n:root{\n  --arf-sh-primary:#071B30;\n  --arf-sh-gray:#C3C8CD;\n  --arf-sh-white:#fff;\n  --arf-sh-black:#000;\n  --arf-sh-border:rgba(255,255,255,.19);\n  --arf-sh-font:\"Almarai\",sans-serif;\n  --arf-sh-fast:180ms ease;\n  --arf-sh-move:420ms cubic-bezier(.2,.8,.2,1);\n  --arf-sh-slow:760ms cubic-bezier(.2,.8,.2,1);\n}\n.arf-small-hero,.arf-small-hero *,.arf-small-hero *::before,.arf-small-hero *::after{box-sizing:border-box}\n.arf-small-hero{\n  position:relative;display:flex;align-items:center;width:100%;min-height:clamp(540px,70svh,670px);\n  overflow:hidden;padding:clamp(7.6rem,13vh,9rem) 0 clamp(2.2rem,5vh,3.4rem);\n  background:var(--arf-sh-primary);color:var(--arf-sh-white);font-family:var(--arf-sh-font);isolation:isolate\n}\n.arf-small-hero__media{\n  position:absolute;inset:0;width:100%;height:100%;min-height:100%;\n  overflow:hidden;background:var(--arf-sh-primary);z-index:-4\n}\n.arf-small-hero__image{\n  position:absolute;inset:-4%;width:108%;height:108%;object-fit:cover;object-position:center 48%;\n  filter:saturate(.58) contrast(1.08) brightness(.68);transform:scale(1.045);\n  transition:transform 1.1s cubic-bezier(.2,.8,.2,1),filter var(--arf-sh-slow);will-change:transform\n}\n.arf-small-hero:hover .arf-small-hero__image{filter:saturate(.7) contrast(1.08) brightness(.74)}\n.arf-small-hero__overlay{\n  position:absolute;inset:0;background:\n  linear-gradient(90deg,rgba(7,27,48,.18),rgba(7,27,48,.76) 54%,rgba(7,27,48,.97)),\n  linear-gradient(to top,rgba(7,27,48,.94),transparent 58%,rgba(7,27,48,.42))\n}\n.arf-small-hero__beam{\n  position:absolute;top:-25%;left:14%;width:38%;height:150%;\n  background:linear-gradient(to bottom,transparent,rgba(255,255,255,.1),transparent);\n  filter:blur(14px);transform:rotate(18deg);animation:arfShBeam 10s ease-in-out infinite\n}\n.arf-small-hero__decor{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:-2}\n.arf-small-hero__orbit{\n  position:absolute;top:-21rem;right:-16rem;width:clamp(37rem,60vw,64rem);aspect-ratio:1;\n  border:1px solid rgba(255,255,255,.12);border-radius:50%;animation:arfShFloat 17s ease-in-out infinite\n}\n.arf-small-hero__orbit::before,.arf-small-hero__orbit::after{\n  content:\"\";position:absolute;border:1px solid rgba(255,255,255,.1);border-radius:inherit\n}\n.arf-small-hero__orbit::before{inset:5rem}\n.arf-small-hero__orbit::after{inset:11rem;border-style:dashed;animation:arfShRotate 35s linear infinite}\n.arf-small-hero__grid{\n  position:absolute;left:-4rem;bottom:-6rem;width:29rem;height:29rem;\n  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),\n  linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);\n  background-size:29px 29px;mask-image:radial-gradient(circle,#000 20%,transparent 72%)\n}\n.arf-small-hero__word{\n  position:absolute;left:-.04em;bottom:-.18em;color:rgba(255,255,255,.027);\n  font-size:clamp(7rem,18vw,18rem);font-weight:800;line-height:1;letter-spacing:-.08em;user-select:none\n}\n.arf-small-hero__container{position:relative;width:min(calc(100% - 2rem),1360px);margin:auto;z-index:2}\n.arf-small-hero__layout{\n  display:grid;grid-template-columns:minmax(0,1.28fr) minmax(280px,.72fr);\n  gap:clamp(2.4rem,7vw,7rem);align-items:center\n}\n.arf-small-hero__content{max-width:760px;opacity:0;transform:translateY(28px);transition:opacity var(--arf-sh-slow),transform var(--arf-sh-slow)}\n.arf-small-hero.is-visible .arf-small-hero__content{opacity:1;transform:none}\n.arf-small-hero__breadcrumb{display:flex;align-items:center;gap:.6rem;margin-bottom:1.55rem;color:var(--arf-sh-gray);font-size:.68rem;font-weight:700}\n.arf-small-hero__breadcrumb a{color:var(--arf-sh-gray);text-decoration:none;transition:color var(--arf-sh-move)}\n.arf-small-hero__breadcrumb a:hover,.arf-small-hero__breadcrumb a:focus-visible{color:#fff;outline:none}\n.arf-small-hero__breadcrumb i{font-size:.5rem;opacity:.6}\n.arf-small-hero__breadcrumb span{color:#fff}\n.arf-small-hero__eyebrow{display:inline-flex;align-items:center;gap:.75rem;margin-bottom:.75rem;color:var(--arf-sh-gray);font-size:clamp(.68rem,.64rem + .13vw,.8rem)}\n.arf-small-hero__eyebrow>span{width:36px;height:1px;background:var(--arf-sh-gray);transition:width var(--arf-sh-move)}\n.arf-small-hero:hover .arf-small-hero__eyebrow>span{width:60px}\n.arf-small-hero h1{margin:0;color:#fff;font-size:clamp(2.05rem,1.52rem + 2.15vw,3.75rem);font-weight:800;line-height:1.15;letter-spacing:-.045em}\n.arf-small-hero__headline{margin:.62rem 0 0;color:#fff;font-size:clamp(1.12rem,.96rem + .55vw,1.55rem);font-weight:700;line-height:1.65}\n.arf-small-hero__headline span{position:relative;display:inline-block;z-index:1}\n.arf-small-hero__headline span::after{\n  content:\"\";position:absolute;right:0;left:0;bottom:.07em;height:.15em;background:var(--arf-sh-gray);\n  opacity:.7;transform:scaleX(.34);transform-origin:right;transition:transform var(--arf-sh-slow);z-index:-1\n}\n.arf-small-hero:hover .arf-small-hero__headline span::after{transform:scaleX(1)}\n.arf-small-hero__description{max-width:670px;margin:1rem 0 0;color:var(--arf-sh-gray);font-size:clamp(.79rem,.75rem + .16vw,.92rem);line-height:1.95}\n.arf-small-hero__actions{display:flex;flex-wrap:wrap;gap:.72rem;margin-top:1.7rem}\n.arf-small-hero__primary,.arf-small-hero__secondary{\n  display:inline-flex;justify-content:center;align-items:center;gap:.7rem;min-height:47px;padding:.72rem .95rem;\n  border-radius:12px;font-size:clamp(.7rem,.67rem + .12vw,.8rem);font-weight:700;text-decoration:none;\n  transition:color var(--arf-sh-move),background var(--arf-sh-move),border-color var(--arf-sh-move),transform var(--arf-sh-move),box-shadow var(--arf-sh-move)\n}\n.arf-small-hero__primary{border:1px solid #fff;background:#fff;color:var(--arf-sh-primary)}\n.arf-small-hero__secondary{border:1px solid var(--arf-sh-border);background:rgba(255,255,255,.055);color:#fff;backdrop-filter:blur(10px)}\n.arf-small-hero__primary:hover,.arf-small-hero__primary:focus-visible,.arf-small-hero__secondary:hover,.arf-small-hero__secondary:focus-visible{\n  border-color:var(--arf-sh-gray);background:var(--arf-sh-gray);color:#000;transform:translateY(-4px);box-shadow:0 13px 32px rgba(0,0,0,.22);outline:none\n}\n.arf-small-hero__actions i{transition:transform var(--arf-sh-move)}\n.arf-small-hero__primary:hover i{transform:translateY(4px)}\n.arf-small-hero__secondary:hover i{transform:translateX(-5px)}\n.arf-small-hero__panel{\n  position:relative;overflow:hidden;min-height:320px;padding:clamp(1.1rem,2.5vw,1.75rem);\n  border:1px solid var(--arf-sh-border);border-radius:25px;\n  background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.025));\n  box-shadow:0 28px 75px rgba(0,0,0,.26);backdrop-filter:blur(14px);opacity:0;transform:translateX(-28px);\n  transition:opacity var(--arf-sh-slow),transform var(--arf-sh-slow),border-color var(--arf-sh-move);isolation:isolate\n}\n.arf-small-hero.is-visible .arf-small-hero__panel{opacity:1;transform:none;transition-delay:130ms}\n.arf-small-hero__panel:hover{border-color:rgba(255,255,255,.44)}\n.arf-small-hero__panel::before{\n  content:\"\";position:absolute;left:-6rem;top:-6rem;width:15rem;aspect-ratio:1;border:1px solid rgba(255,255,255,.13);border-radius:50%;z-index:-1\n}\n.arf-small-hero__panel-head{display:flex;justify-content:space-between;gap:1rem;align-items:center}\n.arf-small-hero__panel-head span{color:var(--arf-sh-gray);font-size:.68rem;font-weight:700}\n.arf-small-hero__panel-head strong{color:rgba(255,255,255,.28);font-size:1.08rem;letter-spacing:.08em}\n.arf-small-hero__panel-icon{\n  display:grid;place-items:center;width:58px;height:58px;margin:2.3rem 0 1rem;border:1px solid var(--arf-sh-border);\n  border-radius:50%;background:rgba(255,255,255,.07);font-size:1.15rem;transition:background var(--arf-sh-move),color var(--arf-sh-move),transform var(--arf-sh-move)\n}\n.arf-small-hero__panel:hover .arf-small-hero__panel-icon{background:var(--arf-sh-gray);color:#000;transform:rotate(-8deg)}\n.arf-small-hero__panel-copy small{display:block;margin-bottom:.38rem;color:var(--arf-sh-gray);font-size:.66rem;font-weight:700}\n.arf-small-hero__panel-copy h2{margin:0;color:#fff;font-size:clamp(.94rem,.87rem + .28vw,1.12rem);font-weight:800;line-height:1.62}\n.arf-small-hero__panel-copy p{margin:.62rem 0 0;color:var(--arf-sh-gray);font-size:clamp(.68rem,.64rem + .12vw,.78rem);line-height:1.82}\n.arf-small-hero__meter{position:absolute;right:1.3rem;left:1.3rem;bottom:1.1rem;height:2px;background:rgba(255,255,255,.16)}\n.arf-small-hero__meter i{display:block;width:0;height:100%;background:#fff;transition:width 1.25s cubic-bezier(.2,.8,.2,1)}\n.arf-small-hero.is-visible .arf-small-hero__meter i{width:72%;transition-delay:420ms}\n.arf-small-hero__bottom{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:clamp(2rem,5vh,3.4rem)}\n.arf-small-hero__scroll{display:inline-flex;align-items:center;gap:.68rem;color:var(--arf-sh-gray);font-size:.66rem;text-decoration:none}\n.arf-small-hero__scroll>i{display:grid;place-items:center;width:33px;height:33px;border:1px solid var(--arf-sh-border);border-radius:50%;color:#fff;animation:arfShScroll 1.8s ease-in-out infinite}\n.arf-small-hero__signature{display:flex;flex-direction:column;align-items:flex-end;gap:.18rem}\n.arf-small-hero__signature strong{font-size:.65rem;letter-spacing:.12em}\n.arf-small-hero__signature small{color:rgba(255,255,255,.38);font-size:.53rem;letter-spacing:.18em}\n.arf-small-hero__progress{position:absolute;right:0;left:0;bottom:0;height:3px;background:rgba(255,255,255,.12)}\n.arf-small-hero__progress i{display:block;width:0;height:100%;background:var(--arf-sh-gray);transition:width 80ms linear}\n@keyframes arfShRotate{to{transform:rotate(360deg)}}\n@keyframes arfShFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-20px,17px,0)}}\n@keyframes arfShBeam{0%,100%{opacity:.35;transform:translateX(0) rotate(18deg)}50%{opacity:.9;transform:translateX(85px) rotate(18deg)}}\n@keyframes arfShScroll{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}\n@media(max-width:980px){\n  .arf-small-hero{min-height:auto}\n  .arf-small-hero__layout{grid-template-columns:minmax(0,1fr) minmax(245px,.62fr);gap:1.7rem}\n}\n@media(max-width:760px){\n  .arf-small-hero{\n    min-height:100svh;\n    min-height:100dvh;\n    padding:7rem 0 2.1rem;\n    background:var(--arf-sh-primary)\n  }\n  .arf-small-hero__container{width:min(calc(100% - 1.25rem),620px)}\n  .arf-small-hero__layout{grid-template-columns:1fr;gap:1.55rem}\n  .arf-small-hero__media{\n    position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:100%!important\n  }\n  .arf-small-hero__image{\n    position:absolute!important;\n    inset:-10% -8%!important;\n    width:116%!important;\n    height:120%!important;\n    min-width:116%!important;\n    min-height:120%!important;\n    max-width:none!important;\n    max-height:none!important;\n    display:block!important;\n    object-fit:cover!important;\n    object-position:50% center;\n    transform:scale(1.08);\n    transform-origin:center center\n  }\n  .arf-small-hero__overlay{background:linear-gradient(to top,rgba(7,27,48,.98),rgba(7,27,48,.72) 60%,rgba(7,27,48,.58))}\n  .arf-small-hero h1{font-size:clamp(1.9rem,10vw,3rem)}\n  .arf-small-hero__headline{font-size:clamp(1.02rem,5.2vw,1.4rem)}\n  .arf-small-hero__description{max-width:96%;font-size:.79rem;line-height:1.88}\n  .arf-small-hero__panel{min-height:245px;padding:1rem;border-radius:20px}\n  .arf-small-hero__panel-icon{width:49px;height:49px;margin:1.15rem 0 .75rem;font-size:.98rem}\n  .arf-small-hero__panel-copy h2{font-size:.95rem}\n  .arf-small-hero__panel-copy p{font-size:.69rem;line-height:1.76}\n  .arf-small-hero__bottom{margin-top:1.7rem}\n  .arf-small-hero__word{font-size:33vw}\n}\n@media(max-width:480px){\n  .arf-small-hero{padding-top:6.55rem}\n  .arf-small-hero__actions{display:grid;grid-template-columns:1fr 1fr;gap:.58rem}\n  .arf-small-hero__primary,.arf-small-hero__secondary{width:100%;min-height:45px;padding:.68rem .75rem;font-size:.7rem}\n  .arf-small-hero__signature{display:none}\n  .arf-small-hero__bottom{justify-content:flex-start}\n}\n@media(prefers-reduced-motion:reduce){\n  .arf-small-hero *,.arf-small-hero *::before,.arf-small-hero *::after{\n    animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important\n  }\n  .arf-small-hero__image{transform:scale(1.08)!important}\n  .arf-small-hero__content,.arf-small-hero__panel{opacity:1;transform:none}\n}\n<\/style>\n<p>\t\t\t\t\t<!DOCTYPE html><br \/>\n<html lang=\"ar\" dir=\"rtl\"><br \/>\n<head><br \/>\n    <meta charset=\"UTF-8\"><br \/>\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"><br \/>\n    <title>\u0645\u0646 \u0646\u062d\u0646 &#8211; \u0645\u062c\u0645\u0648\u0639\u0629 \u0639\u0628\u062f\u0627\u0644\u0631\u062d\u0645\u0646 \u0627\u0644\u0631\u0627\u0641\u0639\u064a<\/title><br \/>\n    <!-- Almarai Font -->\n    <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n    <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Almarai:wght@300;400;700;800&#038;display=swap\" rel=\"stylesheet\">\n    <!-- Font Awesome -->\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n<style>\n        \/* ==========================================================================\n           1. DESIGN SYSTEM & TOKENS (\u0623\u062d\u062c\u0627\u0645 \u0646\u0635\u0648\u0635 \u0635\u063a\u064a\u0631\u0629 \u0648\u0627\u062d\u062a\u0631\u0627\u0641\u064a\u0629)\n           ========================================================================== *\/\n        :root {\n            --color-primary: #071B30;\n            --color-gray: #C3C8CD;\n            --color-black: #000000;\n            --color-off-white: #F8F8F6;\n            --color-white: #FFFFFF;\n            --font-family: \"Almarai\", sans-serif;\n            \/* Typography Base (Mobile First) *\/\n            --fs-xs: 10px;\n            --fs-sm: 12px;\n            --fs-base: 13px;  \/* \u062d\u062c\u0645 \u0627\u0644\u0646\u0635 \u0627\u0644\u0623\u0633\u0627\u0633\u064a \u0635\u063a\u064a\u0631 \u062c\u062f\u0627\u064b *\/\n            --fs-lg: 15px;\n            --fs-xl: 18px;\n            --fs-2xl: 24px;\n            --spacing-sm: 1rem;\n            --spacing-md: 2rem;\n            --spacing-lg: 3rem;\n            --spacing-xl: 5rem;\n            --radius-md: 8px;\n            --transition-normal: 400ms cubic-bezier(.2,.8,.2,1);\n            --transition-slow: 800ms cubic-bezier(.2,.8,.2,1);\n        }\n        @media (min-width: 768px) {\n            :root {\n                --fs-base: 14px;\n                --fs-lg: 16px;\n                --fs-xl: 20px;\n                --fs-2xl: 30px;\n            }\n        }\n        @media (min-width: 1200px) {\n            :root {\n                --fs-base: 14px; \/* \u062b\u0627\u0628\u062a \u0648\u0645\u0642\u0631\u0648\u0621 *\/\n                --fs-lg: 16px;\n                --fs-xl: 22px;\n                --fs-2xl: 36px;\n            }\n        }\n        \/* ==========================================================================\n           2. WRAPPER (NO BODY)\n           ========================================================================== *\/\n        *, *::before, *::after {\n            box-sizing: border-box;\n        }\n        .alrafei-theme {\n            font-family: var(--font-family);\n            background-color: var(--color-off-white);\n            color: var(--color-black);\n            line-height: 1.8;\n            -webkit-font-smoothing: antialiased;\n            overflow: hidden;\n            position: relative;\n        }\n        .alrafei-theme .container {\n            width: 90%;\n            max-width: 1100px;\n            margin: 0 auto;\n            position: relative;\n            z-index: 2;\n        }\n        \/* ==========================================================================\n           3. CINEMATIC ABOUT SECTION\n           ========================================================================== *\/\n        .alrafei-theme .cinematic-about {\n            padding: var(--spacing-xl) 0;\n            position: relative;\n            display: flex;\n            align-items: center;\n            min-height: 80vh;\n        }\n        \/* Watermark \u0627\u0644\u0646\u0635\u064a \u0627\u0644\u0636\u062e\u0645 \u0641\u064a \u0627\u0644\u062e\u0644\u0641\u064a\u0629 *\/\n        .alrafei-theme .watermark {\n            position: absolute;\n            top: 50%;\n            left: -5%;\n            transform: translateY(-50%) rotate(-90deg);\n            font-size: 15vw;\n            font-weight: 800;\n            color: rgba(7, 27, 48, 0.02); \/* \u0643\u062d\u0644\u064a \u0628\u0634\u0641\u0627\u0641\u064a\u0629 2% *\/\n            white-space: nowrap;\n            pointer-events: none;\n            z-index: 1;\n            user-select: none;\n        }\n        \/* \u062e\u0637 \u0639\u0645\u0648\u062f\u064a \u062f\u064a\u0643\u0648\u0631\u064a \u0644\u0631\u0628\u0637 \u0627\u0644\u062a\u0635\u0645\u064a\u0645 *\/\n        .alrafei-theme .vertical-line {\n            position: absolute;\n            top: 0;\n            right: 10%;\n            width: 1px;\n            height: 100%;\n            background-color: rgba(195, 200, 205, 0.3);\n            z-index: 1;\n        }\n        .alrafei-theme .content-grid {\n            display: grid;\n            grid-template-columns: 1fr 1.2fr;\n            gap: var(--spacing-xl);\n            align-items: center;\n        }\n        \/* --- \u0627\u0644\u062c\u0627\u0646\u0628 \u0627\u0644\u0623\u064a\u0645\u0646: \u0627\u0644\u0646\u0635\u0648\u0635 --- *\/\n        .alrafei-theme .text-content {\n            padding-right: var(--spacing-md);\n        }\n        .alrafei-theme .subtitle {\n            font-size: var(--fs-sm);\n            font-weight: 700;\n            color: var(--color-gray);\n            text-transform: uppercase;\n            letter-spacing: 2px;\n            margin-bottom: var(--spacing-sm);\n            display: flex;\n            align-items: center;\n            gap: 10px;\n        }\n        .alrafei-theme .subtitle::before {\n            content: '';\n            width: 30px;\n            height: 1px;\n            background-color: var(--color-gray);\n        }\n        .alrafei-theme .title {\n            font-size: var(--fs-2xl);\n            font-weight: 800;\n            color: var(--color-primary);\n            margin: 0 0 var(--spacing-md) 0;\n        }\n        .alrafei-theme .lead-paragraph {\n            font-size: var(--fs-lg);\n            font-weight: 700;\n            color: var(--color-primary);\n            line-height: 1.6;\n            margin: 0 0 var(--spacing-sm) 0;\n        }\n        .alrafei-theme .normal-paragraph {\n            font-size: var(--fs-base);\n            font-weight: 400;\n            color: #54606C;\n            margin: 0 0 var(--spacing-md) 0;\n        }\n        \/* \u0628\u0644\u0648\u0643 \u0627\u0644\u0641\u0644\u0633\u0641\u0629 \u0628\u062a\u0635\u0645\u064a\u0645 \u0627\u0644\u0627\u0642\u062a\u0628\u0627\u0633 \u0627\u0644\u0645\u0648\u062f\u0631\u0646 *\/\n        .alrafei-theme .philosophy-block {\n            position: relative;\n            padding: var(--spacing-sm) var(--spacing-md);\n            background: linear-gradient(to left, rgba(195, 200, 205, 0.1), transparent);\n            border-radius: var(--radius-md);\n            overflow: hidden;\n            transition: background var(--transition-normal);\n        }\n        .alrafei-theme .philosophy-block::before {\n            content: '';\n            position: absolute;\n            top: 0;\n            right: 0; \/* \u0641\u064a \u0627\u0644\u0640 RTL \u064a\u0643\u0648\u0646 \u0627\u0644\u062e\u0637 \u064a\u0645\u064a\u0646 *\/\n            width: 3px;\n            height: 100%;\n            background-color: var(--color-gray);\n            transition: width var(--transition-normal), background-color var(--transition-normal);\n        }\n        .alrafei-theme .philosophy-block:hover {\n            background: linear-gradient(to left, rgba(7, 27, 48, 0.05), transparent);\n        }\n        .alrafei-theme .philosophy-block:hover::before {\n            width: 5px;\n            background-color: var(--color-primary);\n        }\n        .alrafei-theme .philosophy-block p {\n            font-size: var(--fs-base);\n            font-weight: 400;\n            color: var(--color-primary);\n            margin: 0;\n            position: relative;\n            z-index: 2;\n        }\n        .alrafei-theme .philosophy-block strong {\n            font-weight: 800;\n        }\n        \/* --- \u0627\u0644\u062c\u0627\u0646\u0628 \u0627\u0644\u0623\u064a\u0633\u0631: \u0627\u0644\u0635\u0648\u0631\u0629 \u0648\u062d\u0631\u0643\u0629 \u0627\u0644\u0625\u0637\u0627\u0631 --- *\/\n        .alrafei-theme .image-wrapper {\n            position: relative;\n            padding: var(--spacing-sm);\n        }\n        \/* \u0627\u0644\u0625\u0637\u0627\u0631 \u0627\u0644\u0643\u062d\u0644\u064a \u0627\u0644\u0645\u0646\u0632\u0627\u062d \u0641\u064a \u0627\u0644\u062e\u0644\u0641 *\/\n        .alrafei-theme .image-frame-bg {\n            position: absolute;\n            top: 0;\n            left: 0;\n            width: 90%;\n            height: 90%;\n            background-color: var(--color-primary);\n            border-radius: var(--radius-md);\n            transition: transform var(--transition-slow);\n            z-index: 1;\n        }\n        \/* \u062d\u0627\u0648\u064a\u0629 \u0627\u0644\u0635\u0648\u0631\u0629 \u0646\u0641\u0633\u0647\u0627 *\/\n        .alrafei-theme .image-container {\n            position: relative;\n            width: 90%;\n            margin-right: 10%;\n            margin-top: 10%;\n            border-radius: var(--radius-md);\n            overflow: hidden;\n            box-shadow: 0 20px 40px rgba(0,0,0,0.15);\n            z-index: 2;\n            aspect-ratio: 4 \/ 5;\n            transition: transform var(--transition-slow);\n        }\n        .alrafei-theme .image-container img {\n            width: 100%;\n            height: 100%;\n            object-fit: cover;\n            filter: grayscale(40%) contrast(1.1);\n            transition: filter var(--transition-slow), transform 2s ease;\n        }\n        \/* \u062a\u0623\u062b\u064a\u0631 \u0627\u0644\u0640 Hover \u0627\u0644\u0645\u0628\u0647\u0631 (Parallax Effect) *\/\n        .alrafei-theme .image-wrapper:hover .image-frame-bg {\n            transform: translate(-15px, -15px); \/* \u064a\u062a\u062d\u0631\u0643 \u0644\u0644\u0623\u0639\u0644\u0649 \u0648\u0627\u0644\u064a\u0633\u0627\u0631 *\/\n        }\n        .alrafei-theme .image-wrapper:hover .image-container {\n            transform: translate(10px, 10px); \/* \u0627\u0644\u0635\u0648\u0631\u0629 \u062a\u062a\u062d\u0631\u0643 \u0644\u0644\u0623\u0633\u0641\u0644 \u0648\u0627\u0644\u064a\u0645\u064a\u0646 *\/\n        }\n        .alrafei-theme .image-wrapper:hover .image-container img {\n            filter: grayscale(0%) contrast(1.1);\n            transform: scale(1.05); \/* \u0632\u0648\u0648\u0645 \u0628\u0637\u064a\u0621 \u062f\u0627\u062e\u0644 \u0627\u0644\u0635\u0648\u0631\u0629 *\/\n        }\n        \/* \u0635\u0646\u062f\u0648\u0642 \u0635\u063a\u064a\u0631 \u0641\u0648\u0642 \u0627\u0644\u0635\u0648\u0631\u0629 \u0644\u0644\u062a\u0645\u064a\u0632 *\/\n        .alrafei-theme .floating-box {\n            position: absolute;\n            bottom: 20%;\n            right: -5%;\n            background-color: var(--color-white);\n            padding: 1rem 1.5rem;\n            border-radius: var(--radius-md);\n            box-shadow: 0 10px 30px rgba(7,27,48,0.1);\n            z-index: 3;\n            display: flex;\n            align-items: center;\n            gap: 15px;\n            border: 1px solid rgba(195, 200, 205, 0.3);\n        }\n        .alrafei-theme .floating-box i {\n            font-size: 24px;\n            color: var(--color-primary);\n        }\n        .alrafei-theme .floating-box span {\n            font-size: var(--fs-sm);\n            font-weight: 700;\n            color: var(--color-black);\n            line-height: 1.4;\n        }\n        \/* ==========================================================================\n           4. ANIMATIONS\n           ========================================================================== *\/\n        .alrafei-theme .reveal-up {\n            opacity: 0;\n            transform: translateY(30px);\n            transition: all var(--transition-slow);\n        }\n        .alrafei-theme .reveal-left {\n            opacity: 0;\n            transform: translateX(30px);\n            transition: all var(--transition-slow);\n        }\n        .alrafei-theme .reveal-up.active,\n        .alrafei-theme .reveal-left.active {\n            opacity: 1;\n            transform: translate(0, 0);\n        }\n        .alrafei-theme .delay-1 { transition-delay: 100ms; }\n        .alrafei-theme .delay-2 { transition-delay: 200ms; }\n        .alrafei-theme .delay-3 { transition-delay: 300ms; }\n        \/* ==========================================================================\n           5. RESPONSIVE QUERIES\n           ========================================================================== *\/\n        @media (max-width: 992px) {\n            .alrafei-theme .content-grid {\n                grid-template-columns: 1fr;\n                gap: var(--spacing-xl);\n            }\n            .alrafei-theme .text-content {\n                padding-right: 0;\n            }\n            .alrafei-theme .vertical-line {\n                display: none;\n            }\n            .alrafei-theme .watermark {\n                font-size: 25vw;\n                top: 20%;\n                left: -10%;\n            }\n            .alrafei-theme .floating-box {\n                right: 10%;\n                bottom: -20px;\n            }\n        }\n    <\/style>\n<p><\/head><br \/>\n<body><\/p>\n<section id=\"about\">\n        <!-- \u0627\u0644\u0639\u0644\u0627\u0645\u0629 \u0627\u0644\u0645\u0627\u0626\u064a\u0629 \u0648\u0627\u0644\u062e\u0644\u0641\u064a\u0627\u062a \u0627\u0644\u062f\u064a\u0643\u0648\u0631\u064a\u0629 --><br \/>\n        \u0627\u0644\u0631\u0627\u0641\u0639\u064a<br \/>\n            <!-- \u062c\u0627\u0646\u0628 \u0627\u0644\u0646\u0635\u0648\u0635 --><br \/>\n                    \u0646\u0638\u0631\u0629 \u0639\u0627\u0645\u0629<\/p>\n<h2>\u0645\u0646 \u0646\u062d\u0646<\/h2>\n<p>\n                    \u0645\u062c\u0645\u0648\u0639\u0629 \u0639\u0628\u062f\u0627\u0644\u0631\u062d\u0645\u0646 \u0627\u0644\u0631\u0627\u0641\u0639\u064a \u0644\u0644\u0645\u062d\u0627\u0645\u0627\u0629 \u0648\u0627\u0644\u0627\u0633\u062a\u0634\u0627\u0631\u0627\u062a \u0645\u0646\u0634\u0623\u0629 \u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u0633\u0639\u0648\u062f\u064a\u0629 \u062a\u0642\u062f\u0645 \u062e\u062f\u0645\u0627\u062a \u0627\u0644\u062a\u0645\u062b\u064a\u0644 \u0627\u0644\u0642\u0636\u0627\u0626\u064a \u0648\u0625\u062f\u0627\u0631\u0629 \u0627\u0644\u0645\u0646\u0627\u0632\u0639\u0627\u062a \u0648\u0627\u0644\u062a\u062d\u0643\u064a\u0645\u060c \u0648\u0635\u064a\u0627\u063a\u0629 \u0627\u0644\u0639\u0642\u0648\u062f \u0648\u0627\u0644\u0627\u0633\u062a\u0634\u0627\u0631\u0627\u062a \u0627\u0644\u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u0627\u0644\u0645\u0633\u062a\u0645\u0631\u0629\u060c \u0648\u0627\u0644\u062d\u0648\u0643\u0645\u0629 \u0648\u062a\u0623\u0633\u064a\u0633 \u0627\u0644\u0634\u0631\u0643\u0627\u062a.\n                <\/p>\n<p>\n                    \u062a\u0633\u062a\u0646\u062f \u0627\u0644\u0645\u062c\u0645\u0648\u0639\u0629 \u0625\u0644\u0649 \u0627\u0644\u062e\u0628\u0631\u0629 \u0627\u0644\u0645\u0647\u0646\u064a\u0629 \u0644\u0645\u0624\u0633\u0633\u0647\u0627 \u0627\u0644\u0645\u062d\u0627\u0645\u064a \u0639\u0628\u062f\u0627\u0644\u0631\u062d\u0645\u0646 \u0627\u0644\u0631\u0627\u0641\u0639\u064a\u060c \u0627\u0644\u0645\u0645\u062a\u062f\u0629 \u0645\u0646\u0630 \u0639\u0627\u0645 1435\u0647\u0640\u060c \u0648\u062a\u0639\u0645\u0644 \u0636\u0645\u0646 \u0645\u0646\u0638\u0648\u0645\u0629 \u0645\u0647\u0646\u064a\u0629 \u0645\u0631\u0646\u0629 \u062a\u064f\u0634\u0643\u0651\u0644 \u0645\u0646 \u062e\u0644\u0627\u0644\u0647\u0627 \u0641\u0631\u0642 \u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u0648\u0625\u062f\u0627\u0631\u064a\u0629 \u0628\u062d\u0633\u0628 \u0637\u0628\u064a\u0639\u0629 \u0643\u0644 \u062a\u0643\u0644\u064a\u0641 \u0648\u0645\u062a\u0637\u0644\u0628\u0627\u062a\u0647.\n                <\/p>\n<p>\n                        \u0646\u062a\u0639\u0627\u0645\u0644 \u0645\u0639 \u0627\u0644\u0645\u0633\u0623\u0644\u0629 \u0627\u0644\u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u0628\u0648\u0635\u0641\u0647\u0627 <strong>\u0645\u0633\u0624\u0648\u0644\u064a\u0629<\/strong> \u062a\u0642\u062a\u0636\u064a \u0641\u0647\u0645\u064b\u0627 \u062f\u0642\u064a\u0642\u064b\u0627 \u0644\u0644\u0648\u0642\u0627\u0626\u0639\u060c \u0648\u062a\u0642\u062f\u064a\u0631\u064b\u0627 \u0645\u062a\u0632\u0646\u064b\u0627 \u0644\u0644\u0645\u062e\u0627\u0637\u0631\u060c \u0648\u0648\u0636\u0648\u062d\u064b\u0627 \u0641\u064a \u0627\u0644\u0631\u0623\u064a\u060c \u0648\u0627\u0646\u0636\u0628\u0627\u0637\u064b\u0627 \u0641\u064a \u0627\u0644\u062a\u0646\u0641\u064a\u0630\u061b \u0641\u0644\u064a\u0633\u062a \u0643\u0644 \u0627\u0644\u0645\u0633\u0627\u0626\u0644 \u0633\u0648\u0627\u0621\u060c \u0648\u0644\u0643\u0644 \u0623\u0645\u0631 \u0642\u062f\u0631\u0647 \u0648\u0645\u0627 \u064a\u0644\u0627\u0626\u0645\u0647 \u0645\u0646 \u0639\u0646\u0627\u064a\u0629 \u0648\u062d\u0643\u0645 \u0645\u0647\u0646\u064a.\n                    <\/p>\n<p>            <!-- \u062c\u0627\u0646\u0628 \u0627\u0644\u0635\u0648\u0631\u0629 \u0630\u0648 \u0627\u0644\u062d\u0631\u0643\u0627\u062a \u0627\u0644\u0645\u0628\u0647\u0631\u0629 --><br \/>\n                <!-- \u0627\u0644\u0625\u0637\u0627\u0631 \u0627\u0644\u062e\u0644\u0641\u064a --><br \/>\n                <!-- \u0627\u0644\u0635\u0648\u0631\u0629 \u0627\u0644\u0623\u0633\u0627\u0633\u064a\u0629 --><br \/>\n                    <img decoding=\"async\" src=\"https:\/\/alrafeigroup.com\/wp-content\/uploads\/2026\/07\/2152022033.webp\" alt=\"\u0639\u0646 \u0645\u062c\u0645\u0648\u0639\u0629 \u0627\u0644\u0631\u0627\u0641\u0639\u064a\" loading=\"lazy\"><br \/>\n                <!-- \u0627\u0644\u0635\u0646\u062f\u0648\u0642 \u0627\u0644\u0639\u0627\u0626\u0645 \u0644\u0644\u0645\u0633\u0629 \u063a\u064a\u0631 \u062a\u0642\u0644\u064a\u062f\u064a\u0629 --><br \/>\n                    \u062a\u0623\u0633\u0633\u062a \u0639\u0627\u0645<br \/>1435 \u0647\u0640<br \/>\n    <\/section>\n<p><\/body><br \/>\n<\/html>\t\t\t\t\t<!DOCTYPE html><br \/>\n<html lang=\"ar\" dir=\"rtl\"><br \/>\n<head><br \/>\n    <meta charset=\"UTF-8\"><br \/>\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"><br \/>\n    <title>\u0645\u0628\u0627\u062f\u0626 \u0639\u0645\u0644\u0646\u0627 &#8211; \u0645\u062c\u0645\u0648\u0639\u0629 \u0639\u0628\u062f\u0627\u0644\u0631\u062d\u0645\u0646 \u0627\u0644\u0631\u0627\u0641\u0639\u064a<\/title><br \/>\n    <!-- Almarai Font -->\n    <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n    <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Almarai:wght@300;400;700;800&#038;display=swap\" rel=\"stylesheet\">\n    <!-- Font Awesome -->\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n<style>\n        \/* ==========================================================================\n           1. DESIGN SYSTEM & TOKENS (\u0623\u062d\u062c\u0627\u0645 \u0646\u0635\u0648\u0635 \u0645\u062a\u0646\u0627\u0647\u064a\u0629 \u0627\u0644\u0635\u063a\u0631 \u0648\u0627\u062d\u062a\u0631\u0627\u0641\u064a\u0629)\n           ========================================================================== *\/\n        :root {\n            --color-primary: #071B30;\n            --color-gray: #C3C8CD;\n            --color-black: #000000;\n            --color-off-white: #F8F8F6;\n            --color-white: #FFFFFF;\n            --font-family: \"Almarai\", sans-serif;\n            \/* Mobile Typography *\/\n            --fs-xs: 10px;\n            --fs-sm: 11px;\n            --fs-base: 12px;\n            --spacing-md: 2rem;\n            --spacing-lg: 4rem;\n            \/* Transitions \u0627\u0644\u0645\u0644\u0633\u0627\u0621 \u0644\u0644\u062a\u0645\u062f\u062f *\/\n            --transition-smooth: 600ms cubic-bezier(0.25, 1, 0.5, 1);\n        }\n        @media (min-width: 768px) {\n            :root {\n                --fs-sm: 12px;\n                --fs-base: 13px; \/* \u0627\u0644\u062d\u062c\u0645 \u0627\u0644\u0623\u0633\u0627\u0633\u064a \u0635\u063a\u064a\u0631 \u0648\u0645\u0646\u0627\u0633\u0628 \u0644\u0644\u0640 Editorial *\/\n            }\n        }\n        \/* ==========================================================================\n           2. WRAPPER (NO BODY STYLING)\n           ========================================================================== *\/\n        *, *::before, *::after {\n            box-sizing: border-box;\n        }\n        .alrafei-theme {\n            font-family: var(--font-family);\n            line-height: 1.8;\n            -webkit-font-smoothing: antialiased;\n            overflow: hidden;\n            background-color: var(--color-white); \/* \u062e\u0644\u0641\u064a\u0629 \u0627\u0644\u0635\u0641\u062d\u0629 \u0627\u0644\u0639\u0627\u0645\u0629 \u0644\u0644\u0627\u062e\u062a\u0628\u0627\u0631 *\/\n        }\n        .alrafei-theme .container {\n            width: 90%;\n            max-width: 1200px;\n            margin: 0 auto;\n            position: relative;\n            z-index: 2;\n        }\n        \/* ==========================================================================\n           3. CINEMATIC ACCORDION DIVIDER\n           ========================================================================== *\/\n        .alrafei-theme .sleek-divider {\n            background-color: var(--color-primary); \/* \u0641\u0627\u0635\u0644 \u063a\u0627\u0645\u0642 *\/\n            padding: var(--spacing-lg) 0;\n            position: relative;\n        }\n        \/* \u062a\u0623\u062b\u064a\u0631 \u0627\u0644\u0646\u0628\u0636 \u0627\u0644\u062e\u0641\u064a\u0641 \u0641\u064a \u0627\u0644\u062e\u0644\u0641\u064a\u0629 \u0644\u0632\u064a\u0627\u062f\u0629 \u0627\u0644\u0625\u0628\u0647\u0627\u0631 *\/\n        .alrafei-theme .sleek-divider::before {\n            content: '';\n            position: absolute;\n            inset: 0;\n            background: radial-gradient(circle at 50% 50%, rgba(195, 200, 205, 0.04) 0%, transparent 60%);\n            animation: pulseAmbient 6s infinite alternate;\n            pointer-events: none;\n        }\n        @keyframes pulseAmbient {\n            0% { transform: scale(1); opacity: 0.4; }\n            100% { transform: scale(1.1); opacity: 1; }\n        }\n        \/* \u0627\u0644\u063a\u0644\u0627\u0641 \u0627\u0644\u0630\u064a \u064a\u062d\u0648\u064a \u0627\u0644\u0643\u0628\u0633\u0648\u0644\u0629 \u0648\u0627\u0644\u0635\u0646\u062f\u0648\u0642 *\/\n        .alrafei-theme .divider-wrapper {\n            position: relative;\n            margin-top: 15px; \/* \u0645\u0633\u0627\u062d\u0629 \u0644\u0644\u0643\u0628\u0633\u0648\u0644\u0629 \u0627\u0644\u0639\u0627\u0626\u0645\u0629 *\/\n        }\n        \/* \u0643\u0628\u0633\u0648\u0644\u0629 \u0627\u0644\u0639\u0646\u0648\u0627\u0646 (\u0645\u0628\u0627\u062f\u0626 \u0639\u0645\u0644\u0646\u0627) *\/\n        .alrafei-theme .capsule-title {\n            position: absolute;\n            top: -14px; \/* \u0644\u062a\u0642\u0637\u0639 \u0627\u0644\u062e\u0637 \u0627\u0644\u0639\u0644\u0648\u064a \u0628\u0627\u0644\u0645\u0646\u062a\u0635\u0641 *\/\n            left: 50%;\n            transform: translateX(-50%);\n            background-color: var(--color-primary);\n            color: var(--color-white);\n            font-size: var(--fs-sm);\n            font-weight: 800;\n            letter-spacing: 0.5px;\n            padding: 4px 24px;\n            border: 1px solid rgba(195, 200, 205, 0.25);\n            border-radius: 30px;\n            z-index: 10;\n            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);\n            margin: 0;\n            white-space: nowrap;\n        }\n        \/* \u062d\u0627\u0648\u064a\u0629 \u0627\u0644\u0623\u0643\u0648\u0631\u062f\u064a\u0648\u0646 \u0627\u0644\u0623\u0633\u0627\u0633\u064a\u0629 *\/\n        .alrafei-theme .panels-container {\n            display: flex;\n            width: 100%;\n            height: 220px; \/* \u0631\u0634\u064a\u0642 \u0648\u0623\u0646\u064a\u0642 *\/\n            background-color: rgba(0, 0, 0, 0.2); \/* \u0623\u063a\u0645\u0642 \u0645\u0646 \u0627\u0644\u062e\u0644\u0641\u064a\u0629 \u0644\u0628\u0631\u0648\u0632 \u0627\u0644\u0625\u0637\u0627\u0631 *\/\n            border: 1px solid rgba(195, 200, 205, 0.15);\n            border-radius: 12px;\n            overflow: hidden;\n            position: relative;\n        }\n        \/* \u0643\u0644 \u0645\u0628\u062f\u0623 \u064a\u0645\u062b\u0644 Panel *\/\n        .alrafei-theme .panel {\n            flex: 1; \/* \u062d\u062c\u0645 \u0645\u062a\u0633\u0627\u0648\u064d \u0628\u0627\u0644\u0648\u0636\u0639 \u0627\u0644\u0637\u0628\u064a\u0639\u064a *\/\n            position: relative;\n            display: flex;\n            flex-direction: column;\n            justify-content: center;\n            align-items: center;\n            border-left: 1px solid rgba(195, 200, 205, 0.15); \/* \u062e\u0637 \u0641\u0627\u0635\u0644 \u0646\u062d\u064a\u0641 *\/\n            transition: flex var(--transition-smooth), background var(--transition-smooth);\n            cursor: pointer;\n            overflow: hidden;\n        }\n        .alrafei-theme .panel:last-child {\n            border-left: none; \/* \u0625\u0632\u0627\u0644\u0629 \u0627\u0644\u062e\u0637 \u0639\u0646 \u0622\u062e\u0631 \u0639\u0646\u0635\u0631 (\u0623\u0642\u0635\u0649 \u0627\u0644\u064a\u0633\u0627\u0631 \u0641\u064a \u0627\u0644\u0640 RTL) *\/\n        }\n        \/* ==========================================================================\n           4. MICRO-INTERACTIONS (\u0627\u0644\u0633\u062d\u0631 \u0627\u0644\u062d\u0642\u064a\u0642\u064a \u0647\u0646\u0627)\n           ========================================================================== *\/\n        \/* 1. \u0639\u0646\u062f\u0645\u0627 \u062a\u0642\u0641 \u0639\u0644\u0649 \u0627\u0644\u062d\u0627\u0648\u064a\u0629 \u0628\u0623\u0643\u0645\u0644\u0647\u0627\u060c \u062a\u0646\u0643\u0645\u0634 \u062c\u0645\u064a\u0639 \u0627\u0644\u0640 Panels \u0642\u0644\u064a\u0644\u0627\u064b *\/\n        .alrafei-theme .panels-container:hover .panel {\n            flex: 0.7;\n        }\n        \/* 2. \u0627\u0644\u0640 Panel \u0627\u0644\u0630\u064a \u062a\u0642\u0641 \u0639\u0644\u064a\u0647 \u064a\u062a\u0645\u062f\u062f \u0628\u0634\u0643\u0644 \u062f\u0631\u0627\u0645\u064a *\/\n        .alrafei-theme .panels-container .panel:hover {\n            flex: 2.8; \n            background-color: rgba(195, 200, 205, 0.05);\n        }\n        \/* 3. \u0627\u0644\u0639\u0632\u0644 \u0627\u0644\u0633\u064a\u0646\u0645\u0627\u0626\u064a (Blur) \u0639\u0644\u0649 \u0627\u0644\u0639\u0646\u0627\u0635\u0631 \u063a\u064a\u0631 \u0627\u0644\u0646\u0634\u0637\u0629 *\/\n        .alrafei-theme .panels-container:hover .panel:not(:hover) .panel-content {\n            opacity: 0.15;\n            filter: blur(3px); \/* \u062a\u0623\u062b\u064a\u0631 \u0645\u0628\u0647\u0631 \u064a\u0631\u0643\u0632 \u0627\u0644\u0639\u064a\u0646 \u0639\u0644\u0649 \u0627\u0644\u0639\u0646\u0635\u0631 \u0627\u0644\u0646\u0634\u0637 *\/\n            transform: scale(0.9);\n        }\n        \/* \u0627\u0644\u062a\u0648\u0647\u062c \u0627\u0644\u0633\u0641\u0644\u064a \u0644\u0644\u0639\u0646\u0635\u0631 \u0627\u0644\u0646\u0634\u0637 *\/\n        .alrafei-theme .panel::after {\n            content: '';\n            position: absolute;\n            bottom: 0;\n            left: 0;\n            width: 100%;\n            height: 50%;\n            background: linear-gradient(to top, rgba(255, 255, 255, 0.08), transparent);\n            opacity: 0;\n            transition: opacity var(--transition-smooth);\n            pointer-events: none;\n        }\n        .alrafei-theme .panel:hover::after {\n            opacity: 1;\n        }\n        \/* \u0627\u0644\u062e\u0637 \u0627\u0644\u0645\u0636\u064a\u0621 \u0627\u0644\u0645\u062a\u062d\u0631\u0643 \u0628\u0627\u0644\u0623\u0633\u0641\u0644 *\/\n        .alrafei-theme .panel::before {\n            content: '';\n            position: absolute;\n            bottom: 0;\n            left: 50%;\n            transform: translateX(-50%);\n            width: 0;\n            height: 3px;\n            background-color: var(--color-white);\n            transition: width var(--transition-smooth);\n            z-index: 2;\n        }\n        .alrafei-theme .panel:hover::before {\n            width: 80px;\n        }\n        \/* \u0645\u062d\u062a\u0648\u0649 \u0627\u0644\u0640 Panel (\u0623\u064a\u0642\u0648\u0646\u0629 + \u0646\u0635) *\/\n        .alrafei-theme .panel-content {\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            gap: 15px;\n            transform: translateY(8px);\n            transition: all var(--transition-smooth);\n            width: 100%;\n        }\n        .alrafei-theme .panel:hover .panel-content {\n            transform: translateY(0);\n        }\n        \/* \u062a\u0646\u0633\u064a\u0642 \u0627\u0644\u0623\u064a\u0642\u0648\u0646\u0629 *\/\n        .alrafei-theme .panel-icon {\n            font-size: 22px;\n            color: rgba(195, 200, 205, 0.4); \/* \u062e\u0627\u0641\u062a\u0629 \u0628\u0627\u0644\u0648\u0636\u0639 \u0627\u0644\u0627\u0641\u062a\u0631\u0627\u0636\u064a *\/\n            transition: all var(--transition-smooth);\n        }\n        .alrafei-theme .panel:hover .panel-icon {\n            color: var(--color-white);\n            transform: scale(1.2);\n            text-shadow: 0 0 15px rgba(255, 255, 255, 0.4);\n        }\n        \/* \u062a\u0646\u0633\u064a\u0642 \u0627\u0644\u0646\u0635 (\u0635\u063a\u064a\u0631 \u062c\u062f\u0627\u064b \u0643\u0645\u0627 \u0637\u0644\u0628\u062a) *\/\n        .alrafei-theme .panel-text {\n            font-size: var(--fs-base);\n            font-weight: 400;\n            color: rgba(195, 200, 205, 0.6);\n            white-space: nowrap; \/* \u064a\u0645\u0646\u0639 \u0646\u0632\u0648\u0644 \u0627\u0644\u0646\u0635 \u0644\u0633\u0637\u0631\u064a\u0646 \u0639\u0646\u062f \u0627\u0644\u0627\u0646\u0643\u0645\u0627\u0634 *\/\n            transition: all var(--transition-smooth);\n        }\n        .alrafei-theme .panel:hover .panel-text {\n            color: var(--color-white);\n            font-weight: 700;\n            letter-spacing: 0.5px;\n        }\n        \/* ==========================================================================\n           5. ANIMATIONS & REVEAL\n           ========================================================================== *\/\n        .alrafei-theme .reveal-zoom {\n            opacity: 0;\n            transform: scale(0.96) translateY(20px);\n            transition: all 800ms cubic-bezier(.2,.8,.2,1);\n        }\n        .alrafei-theme .reveal-zoom.active {\n            opacity: 1;\n            transform: scale(1) translateY(0);\n        }\n        \/* ==========================================================================\n           6. RESPONSIVE QUERIES (\u062a\u062c\u0631\u0628\u0629 \u0627\u0644\u0645\u0648\u0628\u0627\u064a\u0644 \u0627\u0644\u0623\u0646\u064a\u0642\u0629)\n           ========================================================================== *\/\n        @media (max-width: 992px) {\n            .alrafei-theme .panels-container {\n                flex-direction: column; \/* \u062a\u0631\u062a\u064a\u0628 \u0639\u0645\u0648\u062f\u064a \u0644\u0644\u0645\u0648\u0628\u0627\u064a\u0644 *\/\n                height: auto;\n            }\n            .alrafei-theme .panel {\n                flex: none !important; \/* \u062a\u0639\u0637\u064a\u0644 \u062a\u0645\u062f\u062f \u0627\u0644\u0641\u0644\u064a\u0643\u0633 \u0639\u0644\u0649 \u0627\u0644\u0645\u0648\u0628\u0627\u064a\u0644 \u0644\u062a\u062c\u0646\u0628 \u0627\u0644\u0623\u062e\u0637\u0627\u0621 *\/\n                height: 70px;\n                border-left: none;\n                border-bottom: 1px solid rgba(195, 200, 205, 0.15);\n                flex-direction: row; \/* \u0627\u0644\u0623\u064a\u0642\u0648\u0646\u0629 \u0648\u0627\u0644\u0646\u0635 \u0628\u062c\u0627\u0646\u0628 \u0628\u0639\u0636 *\/\n                justify-content: flex-start;\n                padding: 0 2rem;\n            }\n            .alrafei-theme .panel:last-child {\n                border-bottom: none;\n            }\n            .alrafei-theme .panel-content {\n                flex-direction: row;\n                transform: none !important;\n                gap: 20px;\n            }\n            \/* \u0625\u0632\u0627\u0644\u0629 \u062a\u0623\u062b\u064a\u0631 \u0627\u0644\u0639\u0632\u0644 \u0648\u0627\u0644\u062e\u0637\u0648\u0637 \u0627\u0644\u0645\u0636\u064a\u0626\u0629 \u0639\u0644\u0649 \u0627\u0644\u0645\u0648\u0628\u0627\u064a\u0644 \u0644\u0639\u062f\u0645 \u0648\u062c\u0648\u062f Hover \u0641\u0639\u0644\u064a *\/\n            .alrafei-theme .panels-container:hover .panel:not(:hover) .panel-content {\n                opacity: 1;\n                filter: none;\n                transform: none;\n            }\n            .alrafei-theme .panel::after, .alrafei-theme .panel::before {\n                display: none;\n            }\n            .alrafei-theme .panel-icon {\n                color: var(--color-white);\n                font-size: 18px;\n            }\n            .alrafei-theme .panel-text {\n                color: var(--color-gray);\n            }\n        }\n    <\/style>\n<p><\/head><br \/>\n<body><br \/>\n    <!-- \u0627\u0644\u0633\u0643\u0634\u0646 \u0627\u0644\u0641\u0627\u0635\u0644 \u0627\u0644\u0645\u0628\u0647\u0631 --><\/p>\n<section id=\"principles\">\n                <!-- \u0643\u0628\u0633\u0648\u0644\u0629 \u0627\u0644\u0639\u0646\u0648\u0627\u0646 --><\/p>\n<h3>\u0645\u0628\u0627\u062f\u0626 \u0639\u0645\u0644\u0646\u0627<\/h3>\n<p>                <!-- \u0635\u0646\u062f\u0648\u0642 \u0627\u0644\u062a\u0645\u062f\u062f \u0627\u0644\u062a\u0641\u0627\u0639\u0644\u064a --><br \/>\n                            \u062a\u0643\u0627\u0645\u0644 \u0627\u0644\u062e\u0628\u0631\u0627\u062a<br \/>\n                            \u0627\u0644\u0633\u0631\u064a\u0629<br \/>\n                            \u0627\u0644\u0648\u0636\u0648\u062d<br \/>\n                            \u0627\u0644\u062f\u0642\u0629<br \/>\n                            \u0627\u0644\u0627\u0633\u062a\u0642\u0644\u0627\u0644<br \/>\n    <\/section>\n<p><\/body><br \/>\n<\/html>\t\t\t\t\t<!-- \u0627\u062d\u0630\u0641 \u0631\u0648\u0627\u0628\u0637 \u0627\u0644\u062e\u0637 \u0648\u0627\u0644\u0623\u064a\u0642\u0648\u0646\u0627\u062a \u0625\u0630\u0627 \u0643\u0627\u0646\u062a \u0645\u062d\u0645\u0651\u0644\u0629 \u0628\u0627\u0644\u0641\u0639\u0644 -->\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link\n    href=\"https:\/\/fonts.googleapis.com\/css2?family=Almarai:wght@300;400;700;800&#038;display=swap\"\n    rel=\"stylesheet\"\n>\n<link\n    rel=\"stylesheet\"\n    href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.7.2\/css\/all.min.css\"\n><\/p>\n<section\n    id=\"arf-vision-section\"\n    dir=\"rtl\"\n    aria-labelledby=\"arf-vision-section-title\"\n><br \/>\n        VISION<br \/>\n        <!-- \u0639\u0646\u0648\u0627\u0646 \u0627\u0644\u0633\u0643\u0634\u0646 --><\/p>\n<header>\n                <strong>\u0645\u0627 \u064a\u0642\u0648\u062f \u0639\u0645\u0644\u0646\u0627<\/strong><\/p>\n<h2 id=\"arf-vision-section-title\">\n                    \u0631\u0624\u064a\u0629 \u0648\u0627\u0636\u062d\u0629\u060c<br \/>\n                    \u0648\u0631\u0633\u0627\u0644\u0629 \u0645\u062a\u0643\u0627\u0645\u0644\u0629<br \/>\n                <\/h2>\n<p>\n                    \u0646\u0639\u0645\u0644 \u0648\u0641\u0642 \u0625\u0637\u0627\u0631 \u0645\u0647\u0646\u064a \u064a\u062c\u0645\u0639 \u0628\u064a\u0646 \u0627\u0644\u0631\u0624\u064a\u0629 \u0627\u0644\u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u0628\u0639\u064a\u062f\u0629 \u0627\u0644\u0645\u062f\u0649\u060c<br \/>\n                    \u0648\u062c\u0648\u062f\u0629 \u0627\u0644\u062a\u0646\u0641\u064a\u0630\u060c \u0648\u0627\u0644\u0645\u0628\u0627\u062f\u0626 \u0627\u0644\u062a\u064a \u062a\u062d\u0643\u0645 \u0643\u0644 \u0639\u0644\u0627\u0642\u0629 \u0648\u062a\u0643\u0644\u064a\u0641.\n                <\/p>\n<\/header>\n<p>        <!-- \u0627\u0644\u0631\u0624\u064a\u0629 \u0648\u0627\u0644\u0631\u0633\u0627\u0644\u0629 --><br \/>\n            <!-- \u0627\u0644\u0645\u062d\u0648\u0631 --><br \/>\n                    01<br \/>\n                    02<br \/>\n            <!-- \u0627\u0644\u0631\u0624\u064a\u0629 --><\/p>\n<article\n                tabindex=\"0\"\n            ><br \/>\n                    01<br \/>\n                        \u0631\u0624\u064a\u062a\u0646\u0627<\/p>\n<h3>\n                        \u0623\u0646 \u0646\u0643\u0648\u0646 \u062e\u064a\u0627\u0631\u064b\u0627 \u0642\u0627\u0646\u0648\u0646\u064a\u064b\u0627<br \/>\n                        \u0645\u0648\u062b\u0648\u0642\u064b\u0627<br \/>\n                    <\/h3>\n<p>\n                        \u0641\u064a \u0627\u0644\u0645\u0633\u0627\u0626\u0644 \u0627\u0644\u062a\u064a \u062a\u0633\u062a\u062f\u0639\u064a \u0631\u0623\u064a\u064b\u0627 \u0631\u0635\u064a\u0646\u064b\u0627\u060c \u0648\u0625\u062f\u0627\u0631\u0629 \u062f\u0642\u064a\u0642\u0629\u060c<br \/>\n                        \u0648\u0645\u0639\u0627\u0644\u062c\u0629 \u062a\u0631\u0627\u0639\u064a \u0623\u0628\u0639\u0627\u062f\u0647\u0627 \u0627\u0644\u0646\u0638\u0627\u0645\u064a\u0629.\n                    <\/p>\n<\/article>\n<p>            <!-- \u0627\u0644\u0631\u0633\u0627\u0644\u0629 --><\/p>\n<article\n                tabindex=\"0\"\n            ><br \/>\n                    02<br \/>\n                        \u0631\u0633\u0627\u0644\u062a\u0646\u0627<\/p>\n<h3>\n                        \u062a\u0623\u0635\u064a\u0644 \u0646\u0638\u0627\u0645\u064a\u060c<br \/>\n                        \u0648\u0641\u0647\u0645 \u0639\u0645\u0644\u064a<br \/>\n                    <\/h3>\n<p>\n                        \u062a\u0642\u062f\u064a\u0645 \u062e\u062f\u0645\u0627\u062a \u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u062a\u062c\u0645\u0639 \u0628\u064a\u0646 \u0627\u0644\u062a\u0623\u0635\u064a\u0644 \u0627\u0644\u0646\u0638\u0627\u0645\u064a \u0648\u0627\u0644\u0641\u0647\u0645<br \/>\n                        \u0627\u0644\u0639\u0645\u0644\u064a \u0648\u062c\u0648\u062f\u0629 \u0627\u0644\u062a\u0645\u062b\u064a\u0644\u060c \u0645\u0646 \u062e\u0644\u0627\u0644 \u0641\u0631\u0642 \u062a\u062a\u0643\u0627\u0645\u0644 \u062e\u0628\u0631\u0627\u062a\u0647\u0627 \u0648\u0641\u0642<br \/>\n                        \u0637\u0628\u064a\u0639\u0629 \u0643\u0644 \u062a\u0643\u0644\u064a\u0641 \u0648\u0623\u0647\u062f\u0627\u0641\u0647.\n                    <\/p>\n<\/article>\n<p>        <!-- \u0627\u0644\u0645\u0628\u0627\u062f\u0626 --><br \/>\n                    \u0627\u0644\u0625\u0637\u0627\u0631 \u0627\u0644\u0645\u0647\u0646\u064a<\/p>\n<h3>\u0645\u0628\u0627\u062f\u0626 \u0639\u0645\u0644\u0646\u0627<\/h3>\n<p>\n                    \u0642\u064a\u0645 \u062b\u0627\u0628\u062a\u0629 \u062a\u062d\u0643\u0645 \u0637\u0631\u064a\u0642\u0629 \u0627\u0644\u062a\u0641\u0643\u064a\u0631\u060c \u0648\u0627\u0644\u062a\u0639\u0627\u0645\u0644\u060c \u0648\u0627\u0644\u062a\u0646\u0641\u064a\u0630.\n                <\/p>\n<p>                <button\n                    type=\"button\"\n                    data-index=\"0\"\n                    data-description=\"\u062a\u0648\u0638\u064a\u0641 \u0627\u0644\u062e\u0628\u0631\u0627\u062a \u0627\u0644\u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u0627\u0644\u0645\u062a\u0646\u0648\u0639\u0629 \u0636\u0645\u0646 \u0641\u0631\u064a\u0642 \u0648\u0627\u062d\u062f \u0644\u062e\u062f\u0645\u0629 \u0637\u0628\u064a\u0639\u0629 \u0643\u0644 \u062a\u0643\u0644\u064a\u0641.\"\n                ><br \/>\n                    01<br \/>\n                    <strong>\u062a\u0643\u0627\u0645\u0644 \u0627\u0644\u062e\u0628\u0631\u0627\u062a<\/strong><br \/>\n                <\/button><br \/>\n                <button\n                    type=\"button\"\n                    data-index=\"1\"\n                    data-description=\"\u0627\u0644\u062a\u0639\u0627\u0645\u0644 \u0645\u0639 \u0627\u0644\u0645\u0639\u0644\u0648\u0645\u0627\u062a \u0648\u0627\u0644\u0645\u0644\u0641\u0627\u062a \u0628\u0623\u0639\u0644\u0649 \u062f\u0631\u062c\u0627\u062a \u0627\u0644\u062e\u0635\u0648\u0635\u064a\u0629 \u0648\u0627\u0644\u0645\u0633\u0624\u0648\u0644\u064a\u0629 \u0627\u0644\u0645\u0647\u0646\u064a\u0629.\"\n                ><br \/>\n                    02<br \/>\n                    <strong>\u0627\u0644\u0633\u0631\u064a\u0629<\/strong><br \/>\n                <\/button><br \/>\n                <button\n                    type=\"button\"\n                    data-index=\"2\"\n                    data-description=\"\u062a\u0642\u062f\u064a\u0645 \u0627\u0644\u0631\u0623\u064a \u0648\u0627\u0644\u0645\u0633\u0627\u0631 \u0648\u0627\u0644\u0625\u062c\u0631\u0627\u0621\u0627\u062a \u0628\u0635\u0648\u0631\u0629 \u0648\u0627\u0636\u062d\u0629 \u062a\u0633\u0627\u0639\u062f \u0627\u0644\u0639\u0645\u064a\u0644 \u0639\u0644\u0649 \u0627\u062a\u062e\u0627\u0630 \u0627\u0644\u0642\u0631\u0627\u0631.\"\n                ><br \/>\n                    03<br \/>\n                    <strong>\u0627\u0644\u0648\u0636\u0648\u062d<\/strong><br \/>\n                <\/button><br \/>\n                <button\n                    type=\"button\"\n                    data-index=\"3\"\n                    data-description=\"\u0627\u0644\u0639\u0646\u0627\u064a\u0629 \u0628\u0627\u0644\u062a\u0641\u0627\u0635\u064a\u0644 \u0627\u0644\u0646\u0638\u0627\u0645\u064a\u0629 \u0648\u0627\u0644\u0625\u062c\u0631\u0627\u0626\u064a\u0629 \u0641\u064a \u0643\u0644 \u0645\u0631\u062d\u0644\u0629 \u0645\u0646 \u0645\u0631\u0627\u062d\u0644 \u0627\u0644\u0639\u0645\u0644.\"\n                ><br \/>\n                    04<br \/>\n                    <strong>\u0627\u0644\u062f\u0642\u0629<\/strong><br \/>\n                <\/button><br \/>\n                <button\n                    type=\"button\"\n                    data-index=\"4\"\n                    data-description=\"\u0635\u064a\u0627\u063a\u0629 \u0627\u0644\u0631\u0623\u064a \u0627\u0644\u0642\u0627\u0646\u0648\u0646\u064a \u0628\u0645\u0648\u0636\u0648\u0639\u064a\u0629 \u0643\u0627\u0645\u0644\u0629 \u0648\u0641\u0642 \u0627\u0644\u0648\u0642\u0627\u0626\u0639 \u0648\u0627\u0644\u0623\u0646\u0638\u0645\u0629 \u0648\u0645\u0635\u0644\u062d\u0629 \u0627\u0644\u0639\u0645\u064a\u0644.\"\n                ><br \/>\n                    05<br \/>\n                    <strong>\u0627\u0644\u0627\u0633\u062a\u0642\u0644\u0627\u0644<\/strong><br \/>\n                <\/button><br \/>\n                    01<br \/>\n                    <strong id=\"arf-principles-title\"><br \/>\n                        \u062a\u0643\u0627\u0645\u0644 \u0627\u0644\u062e\u0628\u0631\u0627\u062a<br \/>\n                    <\/strong><\/p>\n<p id=\"arf-principles-description\">\n                        \u062a\u0648\u0638\u064a\u0641 \u0627\u0644\u062e\u0628\u0631\u0627\u062a \u0627\u0644\u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u0627\u0644\u0645\u062a\u0646\u0648\u0639\u0629 \u0636\u0645\u0646 \u0641\u0631\u064a\u0642 \u0648\u0627\u062d\u062f \u0644\u062e\u062f\u0645\u0629<br \/>\n                        \u0637\u0628\u064a\u0639\u0629 \u0643\u0644 \u062a\u0643\u0644\u064a\u0641.\n                    <\/p>\n<p>                    <i><\/i><br \/>\n<\/section>\n<style>\n    :root {\n        --arf-vs-primary: #071B30;\n        --arf-vs-gray: #C3C8CD;\n        --arf-vs-black: #000000;\n        --arf-vs-off-white: #F8F8F6;\n        --arf-vs-white: #FFFFFF;\n        --arf-vs-bg: #F8F8F6;\n        --arf-vs-surface: rgba(255, 255, 255, 0.72);\n        --arf-vs-surface-hover: #FFFFFF;\n        --arf-vs-text: #071B30;\n        --arf-vs-text-muted: #68737D;\n        --arf-vs-border: rgba(7, 27, 48, 0.14);\n        --arf-vs-border-hover: rgba(7, 27, 48, 0.34);\n        --arf-vs-icon-bg: rgba(7, 27, 48, 0.055);\n        --arf-vs-icon-color: #071B30;\n        --arf-vs-icon-hover-bg: #071B30;\n        --arf-vs-icon-hover-color: #FFFFFF;\n        --arf-vs-font: \"Almarai\", sans-serif;\n        --arf-vs-fs-xs:\n            clamp(0.64rem, 0.61rem + 0.1vw, 0.72rem);\n        --arf-vs-fs-sm:\n            clamp(0.74rem, 0.69rem + 0.16vw, 0.86rem);\n        --arf-vs-fs-base:\n            clamp(0.84rem, 0.78rem + 0.2vw, 0.96rem);\n        --arf-vs-fs-lg:\n            clamp(1rem, 0.9rem + 0.4vw, 1.25rem);\n        --arf-vs-fs-xl:\n            clamp(1.35rem, 1.08rem + 0.9vw, 1.95rem);\n        --arf-vs-fs-title:\n            clamp(1.8rem, 1.35rem + 1.8vw, 3.2rem);\n        --arf-vs-radius-sm: 10px;\n        --arf-vs-radius-md: 18px;\n        --arf-vs-radius-lg: 28px;\n        --arf-vs-shadow:\n            0 24px 65px rgba(7, 27, 48, 0.08);\n        --arf-vs-transition-fast: 180ms ease;\n        --arf-vs-transition:\n            400ms cubic-bezier(.2, .8, .2, 1);\n        --arf-vs-transition-slow:\n            720ms cubic-bezier(.2, .8, .2, 1);\n    }\n    .arf-vision-section,\n    .arf-vision-section *,\n    .arf-vision-section *::before,\n    .arf-vision-section *::after {\n        box-sizing: border-box;\n    }\n    .arf-vision-section {\n        position: relative;\n        width: 100%;\n        overflow: clip;\n        direction: rtl;\n        padding-block: clamp(4rem, 9vw, 7.5rem);\n        background:\n            radial-gradient(\n                circle at 90% 8%,\n                rgba(195, 200, 205, 0.27),\n                transparent 28%\n            ),\n            linear-gradient(\n                135deg,\n                #FFFFFF 0%,\n                var(--arf-vs-bg) 55%,\n                #EFF0EE 100%\n            );\n        color: var(--arf-vs-text);\n        font-family: var(--arf-vs-font);\n        isolation: isolate;\n    }\n    .arf-vision-section__container {\n        position: relative;\n        width: min(calc(100% - 2rem), 1320px);\n        margin-inline: auto;\n        z-index: 2;\n    }\n    \/* \u0627\u0644\u062e\u0644\u0641\u064a\u0629 *\/\n    .arf-vision-section__background {\n        position: absolute;\n        inset: 0;\n        overflow: hidden;\n        pointer-events: none;\n        z-index: -1;\n    }\n    .arf-vision-section__circle {\n        position: absolute;\n        inset-block-start: -18rem;\n        inset-inline-end: -13rem;\n        width: clamp(36rem, 60vw, 64rem);\n        aspect-ratio: 1;\n        border: 1px solid rgba(7, 27, 48, 0.09);\n        border-radius: 50%;\n        animation: arfVisionFloat 16s ease-in-out infinite;\n    }\n    .arf-vision-section__circle::before,\n    .arf-vision-section__circle::after {\n        content: \"\";\n        position: absolute;\n        border: 1px solid rgba(7, 27, 48, 0.07);\n        border-radius: inherit;\n    }\n    .arf-vision-section__circle::before {\n        inset: 5rem;\n    }\n    .arf-vision-section__circle::after {\n        inset: 11rem;\n        border-style: dashed;\n    }\n    .arf-vision-section__grid {\n        position: absolute;\n        inset-inline-start: -5rem;\n        inset-block-end: -6rem;\n        width: 31rem;\n        height: 31rem;\n        background-image:\n            linear-gradient(\n                rgba(7, 27, 48, 0.045) 1px,\n                transparent 1px\n            ),\n            linear-gradient(\n                90deg,\n                rgba(7, 27, 48, 0.045) 1px,\n                transparent 1px\n            );\n        background-size: 30px 30px;\n        mask-image:\n            radial-gradient(\n                circle,\n                #000 20%,\n                transparent 72%\n            );\n    }\n    .arf-vision-section__line {\n        position: absolute;\n        inset-block-start: -10%;\n        inset-inline-start: 33%;\n        width: 1px;\n        height: 125%;\n        background:\n            linear-gradient(\n                to bottom,\n                transparent,\n                rgba(7, 27, 48, 0.15),\n                transparent\n            );\n        transform: rotate(20deg);\n        animation: arfVisionBeam 9s ease-in-out infinite;\n    }\n    .arf-vision-section__word {\n        position: absolute;\n        inset-inline-start: -0.05em;\n        inset-block-end: -0.2em;\n        color: rgba(7, 27, 48, 0.025);\n        font-size: clamp(7rem, 18vw, 18rem);\n        font-weight: 800;\n        line-height: 1;\n        letter-spacing: -0.08em;\n        user-select: none;\n    }\n    \/* Header *\/\n    .arf-vision-section__header {\n        margin-block-end: clamp(3.5rem, 8vw, 6.5rem);\n    }\n    .arf-vision-section__eyebrow {\n        display: inline-flex;\n        align-items: center;\n        gap: 0.8rem;\n        margin-block-end: 1.2rem;\n        color: var(--arf-vs-text-muted);\n        font-size: var(--arf-vs-fs-sm);\n        font-weight: 700;\n    }\n    .arf-vision-section__eyebrow > span {\n        display: block;\n        width: 38px;\n        height: 1px;\n        background: var(--arf-vs-primary);\n        transition: width var(--arf-vs-transition);\n    }\n    .arf-vision-section:hover\n    .arf-vision-section__eyebrow > span {\n        width: 64px;\n    }\n    .arf-vision-section__header-layout {\n        display: grid;\n        grid-template-columns:\n            minmax(300px, 0.9fr)\n            minmax(0, 1.1fr);\n        gap: clamp(2rem, 7vw, 7rem);\n        align-items: end;\n    }\n    .arf-vision-section__header h2 {\n        margin: 0;\n        color: var(--arf-vs-primary);\n        font-size: var(--arf-vs-fs-title);\n        font-weight: 800;\n        line-height: 1.35;\n        letter-spacing: -0.04em;\n    }\n    .arf-vision-section__header h2 span {\n        position: relative;\n        display: inline-block;\n        z-index: 1;\n    }\n    .arf-vision-section__header h2 span::after {\n        content: \"\";\n        position: absolute;\n        inset-inline: 0;\n        inset-block-end: 0.05em;\n        height: 0.14em;\n        background: var(--arf-vs-gray);\n        transform: scaleX(0.35);\n        transform-origin: right;\n        transition: transform var(--arf-vs-transition-slow);\n        z-index: -1;\n    }\n    .arf-vision-section:hover\n    .arf-vision-section__header h2 span::after {\n        transform: scaleX(1);\n    }\n    .arf-vision-section__header p {\n        max-width: 680px;\n        margin: 0;\n        color: var(--arf-vs-text-muted);\n        font-size: var(--arf-vs-fs-base);\n        line-height: 2;\n    }\n    \/* Vision \/ Mission *\/\n    .arf-vision-section__story {\n        position: relative;\n        display: grid;\n        grid-template-columns:\n            minmax(0, 1fr)\n            110px\n            minmax(0, 1fr);\n        grid-template-areas:\n            \"vision axis mission\";\n        gap: clamp(1.5rem, 4vw, 3.5rem);\n        align-items: stretch;\n    }\n    .arf-vision-section__axis {\n        grid-area: axis;\n        position: relative;\n        display: flex;\n        justify-content: center;\n        min-height: 530px;\n    }\n    .arf-vision-section__axis-line {\n        position: absolute;\n        inset-block: 0;\n        width: 1px;\n        background:\n            linear-gradient(\n                to bottom,\n                transparent,\n                var(--arf-vs-border) 12%,\n                var(--arf-vs-border) 88%,\n                transparent\n            );\n    }\n    .arf-vision-section__axis-dot {\n        position: absolute;\n        display: grid;\n        place-items: center;\n        width: 45px;\n        height: 45px;\n        border: 1px solid var(--arf-vs-border);\n        border-radius: 50%;\n        background: var(--arf-vs-bg);\n        color: var(--arf-vs-text-muted);\n        font-size: var(--arf-vs-fs-xs);\n        font-weight: 800;\n        transition:\n            color var(--arf-vs-transition),\n            background-color var(--arf-vs-transition),\n            border-color var(--arf-vs-transition),\n            transform var(--arf-vs-transition);\n    }\n    .arf-vision-section__axis-dot--one {\n        inset-block-start: 18%;\n    }\n    .arf-vision-section__axis-dot--two {\n        inset-block-end: 18%;\n    }\n    .arf-vision-block {\n        position: relative;\n        display: flex;\n        flex-direction: column;\n        min-height: 510px;\n        overflow: hidden;\n        padding: clamp(1.4rem, 3vw, 2.4rem);\n        border: 1px solid var(--arf-vs-border);\n        border-radius: var(--arf-vs-radius-lg);\n        background: var(--arf-vs-surface);\n        box-shadow: var(--arf-vs-shadow);\n        backdrop-filter: blur(12px);\n        outline: none;\n        opacity: 0;\n        transform: translateY(35px);\n        transition:\n            opacity var(--arf-vs-transition-slow),\n            transform var(--arf-vs-transition-slow),\n            border-color var(--arf-vs-transition),\n            background-color var(--arf-vs-transition),\n            box-shadow var(--arf-vs-transition);\n        isolation: isolate;\n    }\n    .arf-vision-block--vision {\n        grid-area: vision;\n    }\n    .arf-vision-block--mission {\n        grid-area: mission;\n        margin-block-start: 90px;\n    }\n    .arf-vision-section.is-visible\n    .arf-vision-block {\n        opacity: 1;\n        transform: translateY(0);\n    }\n    .arf-vision-section.is-visible\n    .arf-vision-block--mission {\n        transition-delay: 130ms;\n    }\n    .arf-vision-block:hover,\n    .arf-vision-block:focus-visible {\n        border-color: var(--arf-vs-border-hover);\n        background: var(--arf-vs-surface-hover);\n        box-shadow: 0 28px 70px rgba(7, 27, 48, 0.12);\n        transform: translateY(-8px);\n    }\n    .arf-vision-block:focus-visible {\n        outline: 3px solid rgba(7, 27, 48, 0.12);\n        outline-offset: 4px;\n    }\n    .arf-vision-block::before {\n        content: \"\";\n        position: absolute;\n        inset-inline-start: -8rem;\n        inset-block-start: -8rem;\n        width: 19rem;\n        aspect-ratio: 1;\n        border: 1px solid rgba(7, 27, 48, 0.08);\n        border-radius: 50%;\n        z-index: -1;\n    }\n    .arf-vision-block::after {\n        content: \"\";\n        position: absolute;\n        inset-inline-end: 0;\n        inset-block-end: 0;\n        width: 45%;\n        height: 40%;\n        background-image:\n            linear-gradient(\n                rgba(7, 27, 48, 0.035) 1px,\n                transparent 1px\n            ),\n            linear-gradient(\n                90deg,\n                rgba(7, 27, 48, 0.035) 1px,\n                transparent 1px\n            );\n        background-size: 22px 22px;\n        mask-image:\n            linear-gradient(\n                to top left,\n                #000,\n                transparent\n            );\n        z-index: -1;\n    }\n    .arf-vision-block__number {\n        align-self: flex-end;\n        color: rgba(7, 27, 48, 0.16);\n        font-size: var(--arf-vs-fs-lg);\n        font-weight: 800;\n        letter-spacing: 0.08em;\n    }\n    .arf-vision-block__icon {\n        display: grid;\n        place-items: center;\n        width: 68px;\n        height: 68px;\n        margin-block: clamp(3rem, 7vw, 5rem) 1.5rem;\n        border: 1px solid var(--arf-vs-border);\n        border-radius: 50%;\n        background: var(--arf-vs-icon-bg);\n        color: var(--arf-vs-icon-color);\n        font-size: 1.35rem;\n        transition:\n            color var(--arf-vs-transition),\n            background-color var(--arf-vs-transition),\n            border-color var(--arf-vs-transition),\n            transform var(--arf-vs-transition);\n    }\n    .arf-vision-block:hover\n    .arf-vision-block__icon,\n    .arf-vision-block:focus-visible\n    .arf-vision-block__icon {\n        border-color: var(--arf-vs-primary);\n        background: var(--arf-vs-icon-hover-bg);\n        color: var(--arf-vs-icon-hover-color);\n        transform: rotate(-8deg);\n    }\n    .arf-vision-block__content {\n        margin-block-start: auto;\n    }\n    .arf-vision-block__label {\n        display: block;\n        margin-block-end: 0.6rem;\n        color: var(--arf-vs-text-muted);\n        font-size: var(--arf-vs-fs-xs);\n        font-weight: 700;\n    }\n    .arf-vision-block h3 {\n        margin: 0;\n        color: var(--arf-vs-primary);\n        font-size: var(--arf-vs-fs-xl);\n        font-weight: 800;\n        line-height: 1.55;\n    }\n    .arf-vision-block h3 span {\n        position: relative;\n        display: inline-block;\n    }\n    .arf-vision-block h3 span::after {\n        content: \"\";\n        position: absolute;\n        inset-inline: 0;\n        inset-block-end: 0.08em;\n        height: 0.13em;\n        background: var(--arf-vs-gray);\n        opacity: 0.85;\n        transform: scaleX(0.3);\n        transform-origin: right;\n        transition: transform var(--arf-vs-transition);\n        z-index: -1;\n    }\n    .arf-vision-block:hover h3 span::after,\n    .arf-vision-block:focus-visible h3 span::after {\n        transform: scaleX(1);\n    }\n    .arf-vision-block p {\n        margin: 1rem 0 0;\n        color: var(--arf-vs-text-muted);\n        font-size: var(--arf-vs-fs-base);\n        line-height: 2;\n    }\n    \/* Principles *\/\n    .arf-principles {\n        margin-block-start: clamp(5rem, 11vw, 9rem);\n    }\n    .arf-principles__heading {\n        display: flex;\n        justify-content: space-between;\n        gap: 2rem;\n        align-items: flex-end;\n        margin-block-end: 1.7rem;\n    }\n    .arf-principles__heading span {\n        display: block;\n        margin-block-end: 0.4rem;\n        color: var(--arf-vs-text-muted);\n        font-size: var(--arf-vs-fs-xs);\n        font-weight: 700;\n    }\n    .arf-principles__heading h3 {\n        margin: 0;\n        color: var(--arf-vs-primary);\n        font-size: var(--arf-vs-fs-xl);\n        font-weight: 800;\n    }\n    .arf-principles__heading p {\n        max-width: 500px;\n        margin: 0;\n        color: var(--arf-vs-text-muted);\n        font-size: var(--arf-vs-fs-sm);\n        line-height: 1.8;\n    }\n    .arf-principles__list {\n        display: grid;\n        grid-template-columns: repeat(5, minmax(0, 1fr));\n        border-block: 1px solid var(--arf-vs-border);\n    }\n    .arf-principle {\n        position: relative;\n        display: flex;\n        flex-direction: column;\n        align-items: flex-start;\n        min-height: 175px;\n        padding: 1.2rem;\n        border: 0;\n        border-inline-end: 1px solid var(--arf-vs-border);\n        background: transparent;\n        color: var(--arf-vs-primary);\n        font-family: var(--arf-vs-font);\n        text-align: right;\n        cursor: pointer;\n        overflow: hidden;\n        transition:\n            color var(--arf-vs-transition),\n            background-color var(--arf-vs-transition),\n            transform var(--arf-vs-transition);\n    }\n    .arf-principle:first-child {\n        border-inline-end: 0;\n    }\n    .arf-principle::before {\n        content: \"\";\n        position: absolute;\n        inset-inline: 0;\n        inset-block-end: 0;\n        height: 3px;\n        background: var(--arf-vs-primary);\n        transform: scaleX(0);\n        transform-origin: right;\n        transition: transform var(--arf-vs-transition);\n    }\n    .arf-principle:hover,\n    .arf-principle:focus-visible,\n    .arf-principle.is-active {\n        background: rgba(255, 255, 255, 0.7);\n        color: var(--arf-vs-black);\n        outline: none;\n        transform: translateY(-5px);\n    }\n    .arf-principle:focus-visible {\n        box-shadow: inset 0 0 0 2px rgba(7, 27, 48, 0.18);\n    }\n    .arf-principle.is-active::before {\n        transform: scaleX(1);\n    }\n    .arf-principle__number {\n        color: var(--arf-vs-text-muted);\n        font-size: var(--arf-vs-fs-xs);\n        font-weight: 700;\n    }\n    .arf-principle__icon {\n        display: grid;\n        place-items: center;\n        width: 44px;\n        height: 44px;\n        margin-block: auto 1rem;\n        border: 1px solid var(--arf-vs-border);\n        border-radius: 14px;\n        background: var(--arf-vs-icon-bg);\n        color: var(--arf-vs-icon-color);\n        font-size: 0.9rem;\n        transition:\n            color var(--arf-vs-transition),\n            background-color var(--arf-vs-transition),\n            transform var(--arf-vs-transition);\n    }\n    .arf-principle:hover\n    .arf-principle__icon,\n    .arf-principle:focus-visible\n    .arf-principle__icon,\n    .arf-principle.is-active\n    .arf-principle__icon {\n        background: var(--arf-vs-primary);\n        color: var(--arf-vs-white);\n        transform: rotate(-7deg);\n    }\n    .arf-principle strong {\n        color: inherit;\n        font-size: var(--arf-vs-fs-sm);\n        font-weight: 800;\n        line-height: 1.55;\n    }\n    .arf-principles__active {\n        display: grid;\n        grid-template-columns: 54px minmax(0, 1fr) 170px;\n        gap: 1.2rem;\n        align-items: center;\n        min-height: 115px;\n        padding: 1.3rem;\n        border-block-end: 1px solid var(--arf-vs-border);\n        background: rgba(255, 255, 255, 0.5);\n    }\n    .arf-principles__active-number {\n        color: rgba(7, 27, 48, 0.22);\n        font-size: var(--arf-vs-fs-lg);\n        font-weight: 800;\n    }\n    .arf-principles__active strong {\n        display: block;\n        color: var(--arf-vs-primary);\n        font-size: var(--arf-vs-fs-lg);\n        font-weight: 800;\n    }\n    .arf-principles__active p {\n        max-width: 760px;\n        margin: 0.35rem 0 0;\n        color: var(--arf-vs-text-muted);\n        font-size: var(--arf-vs-fs-sm);\n        line-height: 1.8;\n    }\n    .arf-principles__active-line {\n        position: relative;\n        display: block;\n        height: 2px;\n        background: rgba(7, 27, 48, 0.12);\n    }\n    .arf-principles__active-line i {\n        display: block;\n        width: 20%;\n        height: 100%;\n        background: var(--arf-vs-primary);\n        transition: width var(--arf-vs-transition-slow);\n    }\n    .arf-principles__active.is-changing > div,\n    .arf-principles__active.is-changing\n    .arf-principles__active-number {\n        opacity: 0;\n        transform: translateY(8px);\n    }\n    .arf-principles__active > div,\n    .arf-principles__active-number {\n        transition:\n            opacity var(--arf-vs-transition-fast),\n            transform var(--arf-vs-transition-fast);\n    }\n    @keyframes arfVisionFloat {\n        0%,\n        100% {\n            transform: translate3d(0, 0, 0);\n        }\n        50% {\n            transform: translate3d(-20px, 18px, 0);\n        }\n    }\n    @keyframes arfVisionBeam {\n        0%,\n        100% {\n            opacity: 0.2;\n            transform: translateX(0) rotate(20deg);\n        }\n        50% {\n            opacity: 0.65;\n            transform: translateX(80px) rotate(20deg);\n        }\n    }\n    @media (max-width: 950px) {\n        .arf-vision-section__header-layout {\n            grid-template-columns: 1fr;\n            gap: 1.4rem;\n        }\n        .arf-vision-section__story {\n            grid-template-columns:\n                minmax(0, 1fr)\n                70px\n                minmax(0, 1fr);\n            gap: 1.2rem;\n        }\n        .arf-principles__list {\n            grid-template-columns:\n                repeat(3, minmax(0, 1fr));\n        }\n        .arf-principle {\n            border-block-end: 1px solid var(--arf-vs-border);\n        }\n        .arf-principle:nth-child(4),\n        .arf-principle:nth-child(5) {\n            border-block-end: 0;\n        }\n    }\n    @media (max-width: 700px) {\n        .arf-vision-section {\n            padding-block: 4rem;\n        }\n        .arf-vision-section__container {\n            width: min(calc(100% - 1.25rem), 620px);\n        }\n        .arf-vision-section__story {\n            display: grid;\n            grid-template-columns: 1fr;\n            grid-template-areas:\n                \"vision\"\n                \"mission\";\n            gap: 1.2rem;\n        }\n        .arf-vision-section__axis {\n            display: none;\n        }\n        .arf-vision-block,\n        .arf-vision-block--mission {\n            min-height: 380px;\n            margin-block-start: 0;\n            padding: 1.2rem;\n            border-radius: 20px;\n        }\n        .arf-vision-block__icon {\n            width: 56px;\n            height: 56px;\n            margin-block: 2rem 1rem;\n            font-size: 1.1rem;\n        }\n        .arf-vision-block h3 {\n            font-size: clamp(1.2rem, 5.8vw, 1.6rem);\n        }\n        .arf-vision-block p {\n            font-size: 0.8rem;\n            line-height: 1.9;\n        }\n        .arf-principles {\n            margin-block-start: 4.5rem;\n        }\n        .arf-principles__heading {\n            flex-direction: column;\n            align-items: flex-start;\n            gap: 0.8rem;\n        }\n        .arf-principles__list {\n            display: flex;\n            gap: 0.7rem;\n            overflow-x: auto;\n            padding-block: 0.5rem 1rem;\n            border-block: 0;\n            scroll-snap-type: x mandatory;\n            scrollbar-width: none;\n        }\n        .arf-principles__list::-webkit-scrollbar {\n            display: none;\n        }\n        .arf-principle {\n            flex: 0 0 150px;\n            min-height: 145px;\n            border: 1px solid var(--arf-vs-border);\n            border-radius: 17px;\n            background: rgba(255, 255, 255, 0.55);\n            scroll-snap-align: start;\n        }\n        .arf-principle:first-child {\n            border-inline-end: 1px solid var(--arf-vs-border);\n        }\n        .arf-principles__active {\n            grid-template-columns: 42px minmax(0, 1fr);\n            gap: 0.8rem;\n            min-height: 125px;\n            padding: 1rem;\n            border: 1px solid var(--arf-vs-border);\n            border-radius: 17px;\n            background: var(--arf-vs-white);\n        }\n        .arf-principles__active-line {\n            display: none;\n        }\n    }\n    @media (max-width: 480px) {\n        .arf-vision-section__header h2 {\n            font-size: clamp(1.55rem, 8vw, 2.15rem);\n        }\n        .arf-vision-section__header p {\n            font-size: 0.8rem;\n            line-height: 1.9;\n        }\n        .arf-vision-block {\n            min-height: 350px;\n        }\n        .arf-principles__active strong {\n            font-size: 0.95rem;\n        }\n        .arf-principles__active p {\n            font-size: 0.74rem;\n        }\n    }\n    @media (prefers-reduced-motion: reduce) {\n        .arf-vision-section *,\n        .arf-vision-section *::before,\n        .arf-vision-section *::after {\n            animation-duration: 0.01ms !important;\n            animation-iteration-count: 1 !important;\n            transition-duration: 0.01ms !important;\n            scroll-behavior: auto !important;\n        }\n        .arf-vision-block {\n            opacity: 1;\n            transform: none;\n        }\n    }\n<\/style>","protected":false},"excerpt":{"rendered":"<p>ABOUT \u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629 \u0645\u0646 \u0646\u062d\u0646 \u0645\u062c\u0645\u0648\u0639\u0629 \u0627\u0644\u0631\u0641\u0627\u0639\u064a \u0627\u0644\u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u0645\u0646 \u0646\u062d\u0646 \u062e\u0628\u0631\u0629 \u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u0631\u0627\u0633\u062e\u0629\u060c \u0628\u0631\u0624\u064a\u0629 \u0645\u0639\u0627\u0635\u0631\u0629 \u0645\u062c\u0645\u0648\u0639\u0629 \u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u0633\u0639\u0648\u062f\u064a\u0629 \u062a\u0642\u062f\u0645 \u062e\u062f\u0645\u0627\u062a\u0647\u0627 \u0648\u0641\u0642 \u0645\u0646\u0647\u062c \u0645\u0647\u0646\u064a \u064a\u062c\u0645\u0639 \u0628\u064a\u0646 \u0639\u0645\u0642 \u0627\u0644\u062e\u0628\u0631\u0629\u060c \u0648\u062f\u0642\u0629 \u0627\u0644\u062a\u062d\u0644\u064a\u0644\u060c \u0648\u0641\u0647\u0645 \u0627\u062d\u062a\u064a\u0627\u062c\u0627\u062a \u0627\u0644\u0639\u0645\u0644\u0627\u0621 \u0648\u0627\u0644\u0642\u0637\u0627\u0639\u0627\u062a \u0627\u0644\u0645\u062e\u062a\u0644\u0641\u0629. \u0627\u0643\u062a\u0634\u0641 \u0642\u0635\u062a\u0646\u0627 \u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0639\u0646 \u0627\u0644\u0645\u062c\u0645\u0648\u0639\u0629 01 \u062d\u0636\u0648\u0631 \u0645\u0647\u0646\u064a \u0645\u0648\u062b\u0648\u0642 \u062e\u0628\u0631\u0629 \u062a\u0633\u062a\u0646\u062f \u0625\u0644\u0649 \u0627\u0644\u0645\u0647\u0646\u064a\u0629 \u0648\u0627\u0644\u062b\u0642\u0629 \u0646\u0639\u0645\u0644 \u0639\u0644\u0649 \u062a\u0642\u062f\u064a\u0645 \u062d\u0644\u0648\u0644 \u0642\u0627\u0646\u0648\u0646\u064a\u0629 \u0648\u0627\u0636\u062d\u0629 \u0648\u0645\u062a\u0648\u0627\u0632\u0646\u0629\u060c [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"template-about.php","meta":{"footnotes":""},"class_list":["post-91","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/alrafeigroup.com\/en\/wp-json\/wp\/v2\/pages\/91","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/alrafeigroup.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/alrafeigroup.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/alrafeigroup.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/alrafeigroup.com\/en\/wp-json\/wp\/v2\/comments?post=91"}],"version-history":[{"count":10,"href":"https:\/\/alrafeigroup.com\/en\/wp-json\/wp\/v2\/pages\/91\/revisions"}],"predecessor-version":[{"id":157,"href":"https:\/\/alrafeigroup.com\/en\/wp-json\/wp\/v2\/pages\/91\/revisions\/157"}],"wp:attachment":[{"href":"https:\/\/alrafeigroup.com\/en\/wp-json\/wp\/v2\/media?parent=91"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}