/* ══════════════════════════════════════════════
   RTL — Arabic Layout Overrides
   Applied via html[dir="rtl"] selector.
   Only directional overrides. Colors & spacing stay in main.css / components.css.
══════════════════════════════════════════════ */

/* Nav */
html[dir="rtl"] .nav-inner  { flex-direction: row-reverse; }
html[dir="rtl"] .nav-links  { flex-direction: row-reverse; }
html[dir="rtl"] .nav-right  { flex-direction: row-reverse; }
html[dir="rtl"] .nav-mobile { align-items: flex-end; }

/* Font overrides for Arabic body text */
html[dir="rtl"] body,
html[dir="rtl"] p,
html[dir="rtl"] span:not(.logo-en):not(.stat-number),
html[dir="rtl"] a,
html[dir="rtl"] li,
html[dir="rtl"] button,
html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select,
html[dir="rtl"] label {
  font-family: var(--font-ar);
}

html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5 {
  font-family: var(--font-ar);
  font-weight: 900;
}

/* Stat numbers always use Latin font */
.stat-number,
.service-num,
.step-num { font-family: var(--font-en) !important; }

/* Logo brand name always uses Inter */
.logo-en { font-family: var(--font-en) !important; }