/* ========================================= DGS Technology — RTL Overrides (Arabic) Loaded only when dir="rtl" IMPORTANT: dir="rtl" on already makes the browser reverse flex-direction:row (items flow right→left) and grid columns (right→left). Do NOT use flex-direction:row-reverse here — it would double-reverse back to LTR. Only override physical CSS properties that don't auto-flip. ========================================= */ /* =================================================== NAVIGATION =================================================== */ /* Flip physical margins → logical equivalents */ .nav-cta { margin-left: 0; margin-right: 16px; } .lang-dropdown { margin-left: 0; margin-right: 8px; } /* Dropdown opens leftward from the button (towards nav centre) */ .lang-dropdown-menu { right: auto; left: 0; } /* Underline animates from right side */ .nav-link::after { transform-origin: right; } /* Mobile menu — right-align links */ .nav-mobile-menu .nav-link { text-align: right; } .lang-mobile-row { flex-direction: row-reverse; } /* =================================================== SECTION HEADERS & LABELS =================================================== */ .section-label, .page-hero-label { text-align: right; } .section-header { text-align: right; } .section-header.centered { text-align: center; } /* =================================================== STORY STATS — flip left border to right =================================================== */ .story-stat-item { border-left: none; border-right: 3px solid var(--accent); padding-left: 0; padding-right: 20px; } /* =================================================== INCLUDED LIST — checkmark on right for RTL dir="rtl" on flex li already moves ::before to right, so just align text. =================================================== */ .included-list li { text-align: right; } /* =================================================== FOOTER =================================================== */ .footer-links { text-align: right; } .footer-contact-item { text-align: right; } .footer-bottom { text-align: right; } .footer-bottom-links { text-align: right; } /* =================================================== PROCESS STEPS =================================================== */ .process-step { text-align: right; } /* =================================================== CONTACT FORM =================================================== */ .form-group label { text-align: right; } .contact-detail-text { text-align: right; } /* =================================================== ARABIC FONT STACK =================================================== */ body { font-family: 'Inter', 'Tajawal', 'Cairo', -apple-system, 'Segoe UI', sans-serif; } /* =================================================== TICKER — scroll in reverse direction for RTL =================================================== */ @keyframes ticker-rtl { 0% { transform: translateX(0); } 100% { transform: translateX(50%); } } .ticker-track { animation-name: ticker-rtl; }