/* Arabic pages (/ar/), 2026-10-23. Loaded only there, after site.css.
   Arabic glyphs are served under the SAME family names the site already uses, limited by
   unicode-range, so every existing Fraunces/Inter rule picks up Noto Naskh / IBM Plex Sans
   Arabic for Arabic text and keeps the Latin fonts for names, brands and numbers. */
@font-face{font-family:'Fraunces';font-style:normal;font-weight:400 700;font-display:swap;
  src:url(../fonts/naskh-ar.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Inter';font-style:normal;font-weight:300;font-display:swap;
  src:url(../fonts/plexar-300.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/plexar-400.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Inter';font-style:normal;font-weight:500 600;font-display:swap;
  src:url(../fonts/plexar-500.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}

/* Letter-spacing pulls Arabic letters apart and breaks the joins between them. */
[lang="ar"] *{letter-spacing:0!important}
[lang="ar"] [lang="en"], [lang="ar"] [lang="en"] *{letter-spacing:revert!important}
/* Arabic sits higher and deeper than Latin: open up the tight display leading so dots and
   descenders never clip, and give body text a little more room. */
[lang="ar"] .display{line-height:1.35}
[lang="ar"] body{line-height:1.8}
[lang="ar"] h1,[lang="ar"] h2,[lang="ar"] h3{line-height:1.45}
/* small uppercase labels have no Arabic equivalent: a touch bigger instead */
[lang="ar"] .meta,[lang="ar"] .nav-links a,[lang="ar"] .sf-col h2,[lang="ar"] .enquiry label,
[lang="ar"] .facts dt,[lang="ar"] .about-facts dt{font-size:max(var(--step--1),.8rem)}

/* ---- mirror the few physical (left/right) rules in site.css ---- */
[dir="rtl"] .founder-note{border-left:0;padding-left:0;border-right:2px solid var(--brass);padding-right:clamp(1.25rem,3vw,2rem)}
[dir="rtl"] .founder-close .founder-sign{text-align:left}
[dir="rtl"] .role-text{text-align:right}
[dir="rtl"] .theme-toggle{margin-left:0;margin-right:.9rem}
/* the spam-trap field is parked off-screen at left:-9999px; in RTL that edge scrolls, so park it right */
[dir="rtl"] .hp{left:auto;right:-9999px}
[dir="rtl"] .card-loc{left:auto;right:1rem}
[dir="rtl"] .card-new{right:auto;left:1rem}
[dir="rtl"] .rv-card figcaption em{margin-left:0;margin-right:auto}
[dir="rtl"] .places-dubai .meta{margin-right:0;margin-left:.8rem}
[dir="rtl"] .wf-btn span{margin-left:0;margin-right:.25em}
[dir="rtl"] .post-table th{text-align:right}
@media (max-width:760px){
  [dir="rtl"] .theme-toggle{right:auto;left:var(--pad);margin-right:0}
  [dir="rtl"] .card-loc{left:auto;right:.5rem}
  [dir="rtl"] .card-new{right:auto;left:.5rem}
}
@media (max-width:639px){[dir="rtl"] .scope-list{padding-right:0;padding-left:3.4rem}}
/* the reviews stay in the clients' own words (English), so they read left to right */
[dir="rtl"] blockquote[lang="en"]{text-align:left}
@media (max-width:760px){[dir="rtl"] .nav .lang-switch{right:auto;left:calc(var(--pad) + 34px + .55rem)}}
@media (min-width:761px){[dir="rtl"] .nav .lang-switch{right:auto;left:calc(var(--pad) + 34px + .9rem)}}
/* hero: keep the two phrases on their own lines, as the English reads */
[lang="ar"] .hero h1.display em,[lang="ar"] .hero-copy h1.display em{display:block}
/* the quick-answers bot is English only: hidden on Arabic pages until it is translated */
[lang="ar"] .chat-float,[lang="ar"] .chat-panel{display:none!important}
/* Arabic text starts at the right edge, where the floating WhatsApp button sits on the
   English pages: mirror the floats so they never cover a heading. */
[dir="rtl"] .wa-float{right:auto;left:clamp(.9rem,2.5vw,1.4rem)}
[dir="rtl"] .wa-float:hover,[dir="rtl"] .wa-float:focus-visible{transform:translateY(-50%) translateX(3px)}
[dir="rtl"] .mb-pill{left:auto;right:clamp(.9rem,2.5vw,1.4rem)}
