/* ==========================================================================
   Arabic / RTL overrides — load AFTER styles.css on the Arabic page
   ========================================================================== */

[dir="rtl"] body{font-family:'Tajawal',sans-serif}
[dir="rtl"] h1,[dir="rtl"] h2,[dir="rtl"] h3,
[dir="rtl"] .cell h3,[dir="rtl"] .tm b,[dir="rtl"] .brand b,
[dir="rtl"] .form h3,[dir="rtl"] .office h3{
  font-family:'Cairo','Tajawal',sans-serif;font-weight:700}

/* Latin tracking / uppercase break Arabic glyph joining — reset them */
[dir="rtl"] body,[dir="rtl"] h1,[dir="rtl"] h2,[dir="rtl"] h3,
[dir="rtl"] .tag,[dir="rtl"] .k,[dir="rtl"] .tm .role,[dir="rtl"] .foot-col h5,
[dir="rtl"] .field label,[dir="rtl"] .stat-row .l,[dir="rtl"] .scrollcue,
[dir="rtl"] nav ul a,[dir="rtl"] .brand small,[dir="rtl"] .foot-bottom,
[dir="rtl"] .form p.sub{
  letter-spacing:normal;text-transform:none}

/* slightly more line-height for comfortable Arabic reading */
[dir="rtl"] .lead,[dir="rtl"] .cell p,[dir="rtl"] .svc p,[dir="rtl"] .step p,
[dir="rtl"] .office p,[dir="rtl"] .founder .quote{line-height:1.9}

/* ---------- directional flips ---------- */
[dir="rtl"] .float{right:-22px;left:auto}
[dir="rtl"] .svc::before{right:0;left:auto}
[dir="rtl"] nav ul a::after{right:0;left:auto}
[dir="rtl"] .hero h1 em::after{right:0;left:auto}
[dir="rtl"] .progress{right:0;left:auto}
[dir="rtl"] .founder .quote{padding-right:26px;padding-left:0}
[dir="rtl"] .founder .quote::before{right:-6px;left:auto;content:"\201D"}
[dir="rtl"] .foot-col a:hover{padding-right:4px;padding-left:0}
[dir="rtl"] .totop{left:26px;right:auto}
[dir="rtl"] .skip{left:auto;right:-9999px}
[dir="rtl"] .skip:focus{right:16px;left:auto}

/* mobile drawer slides in from the LEFT in RTL */
[dir="rtl"] .drawer{inset:0 0 0 auto;right:auto;left:0;transform:translateX(-100%);
  box-shadow:30px 0 60px -30px rgba(0,0,0,.4)}
[dir="rtl"] .drawer.open{transform:translateX(0)}

@media(max-width:640px){
  [dir="rtl"] .float{right:14px;left:auto}
}