/* ============================================================
   Wuthqa — Arabic (RTL) layout layer
   Injected by cms/config.js ONLY when the site language is Arabic, AFTER the
   page CSS and en.css. en.css is the English (Latin type + LTR) layer over an
   Arabic-first base; it also carries some structural component CSS, so we keep
   it loaded and undo just its language-specific rules here. Every rule is
   scoped under [dir="rtl"], so this file is inert in an English context.
   ============================================================ */

/* ---- Type: restore the Arabic family (en.css re-points --font-ar to
   Poppins and hardcodes Latin fonts on headings/nav/labels/buttons). ---- */
[dir="rtl"] { --font-ar: 'Noto Kufi Arabic', sans-serif; }
[dir="rtl"] body { font-family: var(--font-ar); }
[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3, [dir="rtl"] h4, [dir="rtl"] h5, [dir="rtl"] h6,
[dir="rtl"] blockquote,
[dir="rtl"] .wq-nav-link, [dir="rtl"] .wq-nav-trigger, [dir="rtl"] .wq-nav-lang,
[dir="rtl"] .wq-kicker-label, [dir="rtl"] .wq-kicker-idx,
[dir="rtl"] .wq-btn, [dir="rtl"] .wq-chip, [dir="rtl"] .wq-filter-pill, [dir="rtl"] .wq-nl-tag,
[dir="rtl"] [class*="-title"], [dir="rtl"] [class*="-name"], [dir="rtl"] [class*="-h1"],
[dir="rtl"] .wq-hero-title, [dir="rtl"] .wq-hero-lead,
[dir="rtl"] .wq-ct-script, [dir="rtl"] .wq-inv-sub, [dir="rtl"] .wq-ddb-sub, [dir="rtl"] .wq-soon-t {
  font-family: var(--font-ar) !important;
}
/* Keep intentionally-Latin runs (emails, phone numbers) in the Latin family. */
[dir="rtl"] .font-en, [dir="rtl"] .en,
[dir="rtl"] [style*="direction: ltr"], [dir="rtl"] [style*="direction:ltr"] {
  font-family: var(--font-en) !important;
}

/* ---- Undo en.css's LTR direction flips → back to RTL ------------- */
[dir="rtl"] .wq-nav-mobile a { text-align: right; }
[dir="rtl"] .wq-ach-tab { text-align: right; }
[dir="rtl"] .wq-nav-dropdown { left: auto; right: 0; }
[dir="rtl"] .wq-res-aside {
  border-left: none; padding-left: 0;
  border-right: 1px solid var(--border-soft); padding-right: 28px;
}
@media (max-width: 980px) { [dir="rtl"] .wq-res-aside { border-right: none; padding-right: 0; } }
[dir="rtl"] .wq-hero-metric, [dir="rtl"] .wq-band .wq-metric-cell {
  padding-left: 0; padding-right: 24px;
  border-left: none; border-right: 1px solid rgba(255, 255, 255, .14);
}
[dir="rtl"] .wq-band .wq-metric-cell { border-right-color: var(--border); }
[dir="rtl"] .wq-hero-metric:first-child, [dir="rtl"] .wq-band .wq-metric-cell:first-child {
  padding-right: 0; border-right: none;
}
/* Decorative spiral marks mirror back to the left in RTL */
[dir="rtl"] .wq-hero-mark, [dir="rtl"] .wq-lab-mark, [dir="rtl"] .wq-phero-mark { right: auto; left: -90px; }
[dir="rtl"] .wq-lab-mark { left: -140px; }
[dir="rtl"] .wq-contact-mark { left: auto; right: -120px; }
/* Forward arrows point the other way */
[dir="rtl"] .wq-btn .wq-btn-arrow { transform: scaleX(-1); }

/* ---- Home hero: photo panel and copy mirror to the other side --- */
[dir="rtl"] .wq-hero-media { inset: 0 auto 0 0; }
[dir="rtl"] .wq-hero-media-fade {
  background:
    linear-gradient(265deg, var(--teal-900) 0%, var(--teal-900) 12%, rgba(13, 13, 13, .7) 32%, rgba(13, 13, 13, .12) 58%, transparent 78%),
    linear-gradient(0deg, rgba(13, 13, 13, .45) 0%, transparent 26%);
}
[dir="rtl"] #home.wq-hero-split .wq-hero-inner { align-items: flex-start; text-align: right; }
[dir="rtl"] .wq-phero p, [dir="rtl"] .wq-phero2 p { text-align: right; }