/* ===================================================================
   MFAZA — Arabic / RTL overlay. Loaded LAST on /ar/ pages, after the
   shared stylesheets. Flips direction, swaps the type to Cairo, and
   corrects the few absolutely-positioned elements for RTL.
   =================================================================== */

/* Cairo replaces the Latin display/body/serif everywhere via the tokens */
:root{
  --display:"Cairo",sans-serif;
  --body:"Cairo",sans-serif;
  --serif:"Cairo",serif;
}
html[lang="ar"]{direction:rtl}
body{font-family:var(--body)}

/* Arabic must not be letter-spaced (it breaks the joined letterforms) */
[lang="ar"] h1,[lang="ar"] h2,[lang="ar"] h3,[lang="ar"] h4,
[lang="ar"] .eyebrow,[lang="ar"] .nav a,[lang="ar"] .btn,[lang="ar"] .tlink,
[lang="ar"] p,[lang="ar"] li,[lang="ar"] a,[lang="ar"] span,[lang="ar"] .lead,
[lang="ar"] .k,[lang="ar"] .v,[lang="ar"] .role,[lang="ar"] h5,[lang="ar"] .filter,
[lang="ar"] .nl,[lang="ar"] .arch-h2{letter-spacing:normal}

/* Cairo thin reads too light at the design's weights — nudge up */
[lang="ar"] h1,[lang="ar"] h2,[lang="ar"] h3,[lang="ar"] h4,[lang="ar"] .arch-h2{font-weight:500}
[lang="ar"] .eyebrow,[lang="ar"] .nav a,[lang="ar"] .btn,[lang="ar"] h5,[lang="ar"] .filter{font-weight:600}
[lang="ar"] body{font-weight:400}

/* directional arrows (→) should point the RTL way */
[lang="ar"] .arrow{display:inline-block;transform:scaleX(-1)}
[lang="ar"] .btn:hover .arrow{transform:scaleX(-1) translateX(5px)}
[lang="ar"] .tlink:hover .arrow{transform:scaleX(-1) translateX(6px)}

/* home hero: side rail + slide controls mirror to the other edge */
[lang="ar"] .arch-side{left:auto;right:clamp(20px,2.6vw,40px)}
[lang="ar"] .arch-hero__controls{right:auto;left:clamp(20px,4vw,56px)}
[lang="ar"] .arch-hero__counter{border-right:none}

/* project-detail breadcrumb / meta read naturally in RTL already */
[lang="ar"] .crumb .sep{transform:none}

/* numbers, codes and the watermark stay LTR so digits render correctly */
[lang="ar"] .numstats .nv,[lang="ar"] .nv,[lang="ar"] .wm,[lang="ar"] .arch-num,
[lang="ar"] [data-f="code"],[lang="ar"] [data-f="crumb"],[lang="ar"] .pl,[lang="ar"] .no,
[lang="ar"] .tf__n,[lang="ar"] .obj .n{direction:ltr;unicode-bidi:isolate}

/* team / leadership role labels: no letter-spacing in Arabic */
[lang="ar"] .tf .role,[lang="ar"] .lead-msg__body .role,[lang="ar"] .team-card .role{letter-spacing:normal}
[lang="ar"] .tf .role,[lang="ar"] .team-card .role{font-size:16px}

/* eyebrow + leadership role: larger, no tracking, lighter weight in Arabic */
[lang="ar"] .eyebrow{font-size:16px;font-weight:500;letter-spacing:normal}
[lang="ar"] .lead-msg__body .role{font-size:16px;letter-spacing:normal}

/* nav links: 15px, no tracking, lighter weight in Arabic */
[lang="ar"] .nav a{font-size:15px;font-weight:500;letter-spacing:normal}

/* phone numbers must render LTR in RTL context (otherwise digits/groups flip) */
[lang="ar"] a[href^="tel:"]{direction:ltr;unicode-bidi:embed;display:block;width:fit-content}

/* Arabic has no real italics — Cairo oblique looks broken; keep accent words upright */
[lang="ar"] em{font-style:normal!important}