/* BestDOC Homepage — Arabic / RTL overrides
   Loaded after homepage.css and homepage-v2.css. Flips physical
   directional properties, swaps fonts, normalises italic usage.
*/

/* ── Fonts ─────────────────────────────────────────────────────────────── */
[dir="rtl"] {
  --serif: 'Amiri', 'Fraunces', 'Iowan Old Style', Garamond, serif;
  --sans:  'Readex Pro', 'Inter', -apple-system, system-ui, sans-serif;
}

[dir="rtl"] body {
  font-family: 'Readex Pro', 'Inter', -apple-system, system-ui, sans-serif;
  line-height: 1.6;
}

/* Brand wordmark stays Latin serif so chrome sizing matches the EN header. */
[dir="rtl"] .bd-logo,
[dir="rtl"] .bd-logo-word,
[dir="rtl"] .bd-logo-mark {
  font-family: 'Fraunces', 'Iowan Old Style', Garamond, serif;
}
[dir="rtl"] .bd-logo-word i { font-style: italic; }

/* Header nav + footer columns sized to match EN. */
[dir="rtl"] .bd-nav,
[dir="rtl"] .bd-nav a,
[dir="rtl"] .bd-phone-pill,
[dir="rtl"] .bd-btn,
[dir="rtl"] .bd-btn-sm,
[dir="rtl"] .bd-btn-lg,
[dir="rtl"] .bd-ft-h,
[dir="rtl"] .bd-ft-col a,
[dir="rtl"] .bd-ft-col li,
[dir="rtl"] .bd-ft-note,
[dir="rtl"] .bd-ft-contact a,
[dir="rtl"] .bd-ft-bot {
  font-family: 'Readex Pro', 'Inter', -apple-system, system-ui, sans-serif;
  line-height: 1.6;
}

/* Italics aren't idiomatic in Arabic — flatten and lean on color/weight. */
[dir="rtl"] em,
[dir="rtl"] .bd-h2 em,
[dir="rtl"] .bd-mega-n,
[dir="rtl"] .bd-pillar-n,
[dir="rtl"] .bd-acc-n,
[dir="rtl"] .bd-how-n,
[dir="rtl"] .bd-typo-mark,
[dir="rtl"] .bd-cmp-h-tr,
[dir="rtl"] .bd-rev-card blockquote,
[dir="rtl"] .bd-cmp-quote blockquote,
[dir="rtl"] .bd-rev-card-v2 blockquote,
[dir="rtl"] .bd-lede,
[dir="rtl"] .bd-areas-list-v2 li.bd-areas-anywhere a {
  font-style: normal;
}

/* Tighten serif line-height — Amiri runs tall. */
[dir="rtl"] .bd-h1 { line-height: 1.15; letter-spacing: 0; }
[dir="rtl"] .bd-h2 { line-height: 1.2;  letter-spacing: 0; }
[dir="rtl"] .bd-pillar-t,
[dir="rtl"] .bd-acc-t,
[dir="rtl"] .bd-sub-name,
[dir="rtl"] .bd-blog-t,
[dir="rtl"] .bd-faq-row button,
[dir="rtl"] .bd-areas-list-v2 li,
[dir="rtl"] .bd-typo-tag {
  letter-spacing: 0;
}

/* Eyebrows: drop uppercase + tracking — Arabic letters don't have casing. */
[dir="rtl"] .bd-eyebrow,
[dir="rtl"] .bd-blog-tag,
[dir="rtl"] .bd-blog-row-tag,
[dir="rtl"] .bd-team-tag,
[dir="rtl"] .bd-areas-caption,
[dir="rtl"] .bd-cmp-mtag,
[dir="rtl"] .bd-typo-stamp,
[dir="rtl"] .bd-drawer-eyebrow,
[dir="rtl"] .bd-drawer-section-eyebrow,
[dir="rtl"] .bd-drawer-section-all,
[dir="rtl"] .bd-drawer-emerg,
[dir="rtl"] .bd-hero2-cap-eye,
[dir="rtl"] .bd-blog-row-date,
[dir="rtl"] .bd-areas-more {
  text-transform: none;
  letter-spacing: 0;
  font-family: 'Readex Pro', 'Inter', sans-serif;
}

/* Lang toggle keeps Latin tracking — it's the EN/AR pair. */
[dir="rtl"] .bd-lang { font-family: ui-monospace, 'SF Mono', Menlo, monospace; letter-spacing: .14em; }

/* Numerals in stat cells: Arabic-Indic digits, but force LTR direction so
   "+٤٬٥٠٠" / "٤٫٩ ★" / "٢٤ / ٧" render with the high digit on the left. */
[dir="rtl"] .bd-sb-k,
[dir="rtl"] .bd-hs b,
[dir="rtl"] .bd-ps-k,
[dir="rtl"] .bd-ct-phone-n,
[dir="rtl"] .bd-faq-l-phone {
  font-family: 'Readex Pro', 'Amiri', system-ui, sans-serif;
  font-feature-settings: 'tnum' 1;
  direction: ltr;
  unicode-bidi: isolate;
}

/* Phone pill + footer phone + sticky-CTA phone all render LTR so the dot,
   "+", country code and digits keep the same visual order as the EN site. */
[dir="rtl"] .bd-phone-pill,
[dir="rtl"] .bd-ct-phone,
[dir="rtl"] .bd-ft-contact a,
[dir="rtl"] .bd-stickycta-secondary {
  direction: ltr;
  unicode-bidi: isolate;
}

/* ── Header / mega menu ────────────────────────────────────────────────── */
[dir="rtl"] .bd-mega-col {
  padding-right: 0;
  padding-left: 12px;
  border-right: none;
  border-left: .5px solid var(--bd-hairline);
}
[dir="rtl"] .bd-mega-col:last-child { border-left: none; }
[dir="rtl"] .bd-mega-col li a:hover { padding-left: 0; padding-right: 4px; }

@media (max-width: 1100px) {
  [dir="rtl"] .bd-mega-col { padding-left: 0; border-left: none; }
}

/* ── Hero caption ──────────────────────────────────────────────────────── */
/* left/right both set already, fine. */

/* ── FAQ ──────────────────────────────────────────────────────────────── */
[dir="rtl"] .bd-faq-row button { text-align: right; }

/* ── Accordion ────────────────────────────────────────────────────────── */
[dir="rtl"] .bd-acc-head { text-align: right; }
[dir="rtl"] .bd-acc-body { padding: 0 72px 32px 8px; }
@media (max-width: 1100px) {
  [dir="rtl"] .bd-acc-body { padding: 0 6px 24px 6px; }
}

/* ── Compare table ────────────────────────────────────────────────────── */
[dir="rtl"] .bd-cmp-tbl th { text-align: right; }
[dir="rtl"] .bd-cmp-bullets li span { padding-right: 0; padding-left: 6px; }

/* ── How (column dividers) ────────────────────────────────────────────── */
[dir="rtl"] .bd-how-card { border-left: none; border-right: .5px solid var(--bd-hairline); padding: 0 24px; }
[dir="rtl"] .bd-how-card:first-child { border-right: none; padding-right: 0; padding-left: 24px; }
[dir="rtl"] .bd-how-card:last-child { padding-left: 0; padding-right: 24px; }
@media (max-width: 960px) {
  [dir="rtl"] .bd-how-card { border: none; padding: 0; }
}

/* ── Stats band cells ─────────────────────────────────────────────────── */
[dir="rtl"] .bd-sb-cell {
  padding-right: 0; padding-left: 12px;
  border-right: none; border-left: .5px solid rgba(246,241,232,.12);
}
[dir="rtl"] .bd-sb-cell:last-child { border-left: none; }
@media (max-width: 960px) {
  [dir="rtl"] .bd-sb-cell { padding-left: 0; border-left: none; }
}

/* ── TypoBlock (blog placeholders) ────────────────────────────────────── */
[dir="rtl"] .bd-typo-stamp { left: auto; right: 16px; }
[dir="rtl"] .bd-typo-tag   { margin-right: 0; margin-left: 30%; }
[dir="rtl"] .bd-typo-mark  { right: auto; left: 16px; }
[dir="rtl"] .bd-typo-arc   { right: auto; left: -10%; transform: scaleX(-1); }

/* ── Drawer (slides from left in RTL) ─────────────────────────────────── */
[dir="rtl"] .bd-drawer {
  right: auto; left: 0;
  border-left: none; border-right: .5px solid var(--bd-hairline);
  box-shadow: 20px 0 60px rgba(0,0,0,.18);
  transform: translateX(-100%);
}
[dir="rtl"] .bd-drawer-root.open .bd-drawer { transform: translateX(0); }
[dir="rtl"] .bd-drawer-x,
[dir="rtl"] .bd-modal-x { right: auto; left: 14px; }
[dir="rtl"] .bd-drawer-pillar { text-align: right; }
[dir="rtl"] .bd-drawer-subwrap { padding: 0 44px 16px 0; }
[dir="rtl"] .bd-drawer-sub:hover { padding-left: 0; padding-right: 4px; }
[dir="rtl"] .bd-drawer-emerg { text-align: left; }

/* Original keyframes still reference translateX(100%); for RTL we override
   with explicit transform on the open class above, so the keyframe-based
   .bd-drawer (sticky-positioned variant) doesn't leak. */
@keyframes bd-slide-in-rtl { from { transform: translateX(-100%); } to { transform: translateX(0); } }

/* ── Generic flips for arrows in body copy ────────────────────────────── */
/* Arrow glyphs in our copy are written as ← so they already point in the
   reading-direction (toward the next visual position in RTL). No flip needed. */

/* ── Sub card hover (not directional) ─────────────────────────────────── */

/* ── Areas grid ───────────────────────────────────────────────────────── */
/* grid is symmetric; column-gap fine */

/* ── Reviews v2 horizontal scroller (mobile) ──────────────────────────── */
@media (max-width: 720px) {
  [dir="rtl"] .bd-rev-cards-v2 { scroll-snap-type: x mandatory; }
}

/* ── Section anchor nav ──────────────────────────────────────────────── */
/* flex auto-flips; padding-x symmetric. */

/* ── Footer ──────────────────────────────────────────────────────────── */
[dir="rtl"] .bd-ft-bot { flex-direction: row; }
@media (max-width: 960px) {
  [dir="rtl"] .bd-ft-bot { align-items: flex-end; }
}

/* ── Sticky CTA ───────────────────────────────────────────────────────── */
/* flex auto-flips; padding symmetric. */

/* ── Burger animation flip ───────────────────────────────────────────── */
/* burger lines symmetric. */

/* ── Buttons: keep arrows visually consistent with reading flow ─────── */
[dir="rtl"] .bd-btn,
[dir="rtl"] .bd-btn-ghost,
[dir="rtl"] .bd-mega-all,
[dir="rtl"] .bd-blog-a,
[dir="rtl"] .bd-pillar-a,
[dir="rtl"] .bd-sub-link,
[dir="rtl"] .bd-blog-mobile-all { letter-spacing: 0; }

/* Restore center alignment for centered section heads */
[dir="rtl"] .bd-sec-head { text-align: center; }
[dir="rtl"] .bd-sec-head .bd-body { text-align: center; }

/* Phone-pill: dot on the leading edge — flex naturally flips. */

/* Hide LTR-only quote glyph in case it ships from CSS — we don't, so noop. */

/* ─── Service-detail v2 RTL flips ─────────────────────────────────────────
   Loaded on /ar/<slug>/ pages alongside service-detail-v2.css.
   service-detail-v2.css uses physical directional props in many places;
   mirror them for RTL here. */

/* Hero title em + section h2 em: drop italic in Arabic. */
[dir="rtl"] .bd-sd2-hero-title em,
[dir="rtl"] .bd-sd2-sec-head h2 em,
[dir="rtl"] .bd-sd2-how-head h2 em,
[dir="rtl"] .bd-sd2-blog-head h2 em,
[dir="rtl"] .bd-sd2-faq h2 em,
[dir="rtl"] .bd-sd2-quote blockquote,
[dir="rtl"] .bd-sd2-rail-n,
[dir="rtl"] .bd-sd2-cta h2 em {
  font-style: normal;
}

/* Eyebrows / monospaced bits: drop tracking + uppercase in Arabic. */
[dir="rtl"] .bd-sd2-eyebrow,
[dir="rtl"] .bd-sd2-num-eyebrow,
[dir="rtl"] .bd-sd2-bookcard-eyebrow,
[dir="rtl"] .bd-sd2-bookcard-pop,
[dir="rtl"] .bd-sd2-rail-t,
[dir="rtl"] .bd-sd2-bookcard-rows .k,
[dir="rtl"] .bd-sd2-bookcard-rows .v .ccy,
[dir="rtl"] .bd-sd2-price-tag,
[dir="rtl"] .bd-sd2-price-amt .ccy,
[dir="rtl"] .bd-sd2-related-tag,
[dir="rtl"] .bd-sd2-include-n,
[dir="rtl"] .bd-sd2-cta-phone .l {
  text-transform: none;
  letter-spacing: 0;
  font-family: 'Readex Pro', 'Inter', sans-serif;
}

/* Price digit / hero meta numerals — keep LTR for natural numeric ordering. */
[dir="rtl"] .bd-sd2-meta b,
[dir="rtl"] .bd-sd2-bookcard-rows .v,
[dir="rtl"] .bd-sd2-price-amt {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: right;
}

/* Bookcard rows divider flip. */
[dir="rtl"] .bd-sd2-bookcard-rows>div+div {
  padding-left: 0;
  padding-right: 16px;
  border-left: none;
  border-right: .5px solid var(--bd-hairline);
}

/* Includes accordion: text-align + body padding. */
[dir="rtl"] .bd-sd2-include-head { text-align: right; }
[dir="rtl"] .bd-sd2-include-body { padding: 0 50px 22px 22px; }
@media (max-width: 720px) {
  [dir="rtl"] .bd-sd2-include-body { padding: 0 50px 0 16px; }
  [dir="rtl"] .bd-sd2-include.open .bd-sd2-include-body { padding: 0 50px 18px 16px; }
}

/* How-it-works rail: vertical line on the right side in RTL. */
[dir="rtl"] .bd-sd2-rail-line { left: auto; right: 23px; }
@media (max-width: 720px) {
  [dir="rtl"] .bd-sd2-rail-line { left: auto; right: 23px; }
}

/* Pricing card: tag pinned to the right; bullets bullet-padding flip. */
[dir="rtl"] .bd-sd2-price-tag { left: auto; right: 24px; }
[dir="rtl"] .bd-sd2-price-card ul { padding: 0 18px 0 0; }
[dir="rtl"] .bd-sd2-price-amt .per { margin-left: 0; margin-right: 2px; }
[dir="rtl"] .bd-sd2-price-fine { text-align: right; }

/* "Right for / Not right for" bullets. */
[dir="rtl"] .bd-sd2-who-col li { padding-left: 0; padding-right: 18px; }
[dir="rtl"] .bd-sd2-who-col li:before { left: auto; right: 0; }

/* CTA banner phone alignment: keep label/number flush to the leading edge. */
[dir="rtl"] .bd-sd2-cta-phone { align-items: flex-end; }

/* Anchor breadcrumb separator spacing — flex auto-flips, no overrides needed. */

/* Section heads default to grid; align-items end is fine in RTL. */


/* ─── FAQ page (faq.css) RTL flips ─────────────────────────────────────────
   /ar/faq/. faq.css uses physical dirs in a few places — mirror for RTL. */

/* Drop italic emphasis (Arabic doesn't italicize). */
[dir="rtl"] .bd-fq-hero h1 em,
[dir="rtl"] .bd-fq-hero p.lede,
[dir="rtl"] .bd-fq-cat-h h2 em,
[dir="rtl"] .bd-fq-cat-h .num,
[dir="rtl"] .bd-fq-cat-blurb,
[dir="rtl"] .bd-fq-acc .n,
[dir="rtl"] .bd-fq-cta h2 em,
[dir="rtl"] .bd-fq-cta-phone .l {
  font-style: normal;
}

/* Eyebrow/monospaced bits — drop tracking + uppercase in Arabic. */
[dir="rtl"] .bd-fq-side-h,
[dir="rtl"] .bd-fq-acc-body .meta {
  text-transform: none;
  letter-spacing: 0;
  font-family: 'Readex Pro', 'Inter', sans-serif;
}

/* Search bar: asymmetric padding flips in RTL. */
[dir="rtl"] .bd-fq-search {
  padding: 8px 22px 8px 8px;
}

/* Sidebar category buttons: text-align right + .c numeric LTR. */
[dir="rtl"] .bd-fq-side button { text-align: right; }
[dir="rtl"] .bd-fq-side button .c { direction: ltr; unicode-bidi: isolate; }

/* Accordion question button: text-align right. */
[dir="rtl"] .bd-fq-acc button { text-align: right; }

/* CTA phone: italic label dropped above; numeric LTR for "+971…". */
[dir="rtl"] .bd-fq-cta-phone .n { direction: ltr; unicode-bidi: isolate; }