/* ==========================================================================
   Keel Partners — RTL layer (Arabic)
   Loaded only on /ar/ pages, after site.css.
   site.css already uses logical properties (inset-inline, padding-inline,
   margin-inline, border-inline) so most of the layout mirrors automatically.
   This file handles what cannot be expressed logically: type, glyph
   direction, and a handful of transforms.
   ========================================================================== */

:root{
  /* Arabic display + body faces. Falls back through the faces shipped with
     macOS, iOS, Windows and Android — no external font request. */
  --ff-display:"Amiri","Noto Naskh Arabic","Al Bayan","Traditional Arabic","Times New Roman",serif;
  --ff-body:"Noto Sans Arabic","Segoe UI",-apple-system,"Geeza Pro","Dubai",Tahoma,Arial,sans-serif;
}

html[dir="rtl"] body{
  font-size:17.5px;
  line-height:1.85;            /* Arabic needs more leading */
  letter-spacing:0;            /* never track Arabic */
}

html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3{letter-spacing:0;line-height:1.35}
html[dir="rtl"] h1{font-size:clamp(2rem,4.6vw,3.1rem)}

/* Uppercase transforms are meaningless in Arabic — and the wide tracking
   used on Latin kickers breaks Arabic joining. */
html[dir="rtl"] .kicker,
html[dir="rtl"] .mega__h,
html[dir="rtl"] .ftr h4,
html[dir="rtl"] th,
html[dir="rtl"] .field label,
html[dir="rtl"] .list__meta,
html[dir="rtl"] .hero__meta,
html[dir="rtl"] .stat__l{text-transform:none;letter-spacing:0;font-weight:700}

/* Arrow glyphs point the other way */
html[dir="rtl"] .tlink::after{content:"\2190"}

/* Chevrons and carets are drawn from two borders on a rotated square.
   Logical border properties flip with direction, which would point them
   the wrong way, so pin them to physical sides and re-derive the angle. */
html[dir="rtl"] .nav__l[data-has-menu]::after{
  border-inline-end:0;border-block-end:0;
  border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;
  transform:rotate(45deg) translateY(-1px);
}
html[dir="rtl"] .faq summary::after{
  border-inline-end:0;border-block-end:0;
  border-left:1.5px solid var(--brass-600);border-bottom:1.5px solid var(--brass-600);
  transform:rotate(-45deg);
}
html[dir="rtl"] .faq details[open] summary::after{transform:rotate(135deg)}
html[dir="rtl"] .checks li::before{transform:rotate(45deg)}

/* Mega menu centring transform is direction-neutral, but re-declare for
   clarity when the drawer is mirrored. */
html[dir="rtl"] .mega{transform:translateX(50%) translateY(-6px)}
html[dir="rtl"] .nav__i[data-open="true"] .mega{transform:translateX(50%) translateY(0)}

/* Numerals: keep Western digits for figures buyers cross-check (AED
   amounts, dates, percentages). Set to "arabic-indic" only if the client
   explicitly wants ٠١٢٣. */
html[dir="rtl"] .stat__n,
html[dir="rtl"] table,
html[dir="rtl"] .steps li::before{font-feature-settings:"lnum" 1;direction:rtl;unicode-bidi:plaintext}

/* The wordmark stays LTR — it is a Latin trade name */
html[dir="rtl"] .brand__wm{direction:ltr;unicode-bidi:isolate;letter-spacing:.03em}

/* Mixed-direction inline content (emails, URLs, phone numbers) */
html[dir="rtl"] .ltr{direction:ltr;unicode-bidi:isolate;display:inline-block}