/* * RTL overrides for Arabic (lang.rtl=true). * * Loaded only when is set (see base.html.j2). Most layout * uses logical flexbox so the cascade flips automatically; this file fixes * the spots where direction-aware tweaks are still needed. */ html[dir="rtl"] body.rtl { direction: rtl; text-align: right; } html[dir="rtl"] .container, html[dir="rtl"] .hero-content, html[dir="rtl"] .services-head { text-align: right; } /* Header: keep the brand on the right (visual leading edge in RTL), nav to the left of it, lang switcher at the visual end. */ html[dir="rtl"] .site-header .header-inner { flex-direction: row-reverse; } html[dir="rtl"] .primary-nav { flex-direction: row-reverse; } /* Lang switcher caret faces the menu when open — keep it visual. */ html[dir="rtl"] .lang-caret { display: inline-block; transform: scaleX(-1); } /* Lists: bullet point should sit on the right side in RTL. */ html[dir="rtl"] ul, html[dir="rtl"] ol { padding-right: 1.2em; padding-left: 0; } /* Service-card link arrows / underline edges. */ html[dir="rtl"] .text-link { text-align: right; } /* Process-step badge alignment in the delivery-model section. */ html[dir="rtl"] .process-step { margin-left: 0.5em; margin-right: 0; } /* Footer rows stay left-to-right because brand+copy is symmetric; but the privacy link should be at the visual end. */ html[dir="rtl"] .site-footer .footer-inner { text-align: right; } /* Hero brand lockup uses an image+text grid — flip its row order. */ html[dir="rtl"] .hero-brand-lockup { direction: rtl; } html[dir="rtl"] .hero-brand-copy { text-align: right; } /* Buttons: keep tel: numbers LTR-rendered inside an RTL line. */ html[dir="rtl"] a[href^="tel:"] { unicode-bidi: embed; direction: ltr; display: inline-block; }