/* =========================================================
   Mighty Leap - Arabic RTL + font foundation layer
   Loaded only on /ar/* pages (html[dir="rtl"]).
   ========================================================= */

html[dir="rtl"]{
  --font-sans: "IBM Plex Sans Arabic","IBM Plex Sans","Segoe UI",sans-serif;
  --font-serif: "Amiri","Newsreader",Georgia,serif;
  --font-nav: "IBM Plex Sans Arabic","Source Sans 3",sans-serif;
}

html[dir="rtl"] body{ text-align: right; }

html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3{ line-height: 1.4; letter-spacing: 0; }

html[dir="rtl"] .eyebrow,
html[dir="rtl"] .section-kicker,
html[dir="rtl"] [class*="kicker"],
html[dir="rtl"] [class*="label"]{ letter-spacing: 0 !important; }

html[dir="rtl"] .button svg,
html[dir="rtl"] .mega-item__more svg,
html[dir="rtl"] [class*="arrow"] svg,
html[dir="rtl"] [class*="__more"] svg,
html[dir="rtl"] .jump-control svg{ transform: scaleX(-1); }

/* ---------------------------------------------------------
   Homepage review pass - RTL layout corrections
   --------------------------------------------------------- */

/* A) Capabilities heading has an optical negative inline-start margin;
      in RTL the start edge is the right, so it hangs past the card edge
      and clips the first letter. Neutralize it. */
html[dir="rtl"] .capabilities-system-header > h2{
  margin-inline-start: 0 !important;
  margin-right: 0 !important;
}

/* B) Marquees (client-logo strip + wordbar) use a flex track scrolled
      with translateX(0 -> -50%). A flex track anchors to its inline-start
      edge, so under dir:rtl it starts anchored right and sits entirely
      off-screen left - the strip renders empty. Forcing LTR flow on the
      row/track restores anchoring; each Arabic word/logo still shapes RTL. */
html[dir="rtl"] .clients-strip .marquee,
html[dir="rtl"] .clients-strip .marquee__track,
html[dir="rtl"] .wordbar .wordbar__row,
html[dir="rtl"] .wordbar .wordbar__track{
  direction: ltr !important;
}


/* RTL mega-menu positioning fix: anchor panels to the right edge of the trigger so they open leftward and stay on-screen */
html[dir="rtl"] .mega-panel{left:auto !important;right:-6px !important;}
html[dir="rtl"] .mega-panel--ind{left:auto !important;right:-6px !important;}