/* ============================================================ STA Erbil Service Center — RTL Overrides (Arabic & Kurdish) Applied when is set ============================================================ */ [dir="rtl"] body { text-align: right; } /* ---- Logo bar ---- */ [dir="rtl"] .logo-bar { flex-direction: row-reverse; } [dir="rtl"] .lang-switcher { flex-direction: row-reverse; } /* ---- Hero ---- */ [dir="rtl"] .hero { justify-content: flex-end; } [dir="rtl"] .hero-overlay { background: linear-gradient(to left, rgba(0,0,0,0.78), rgba(0,0,0,0.18)); } [dir="rtl"] .hero-content { text-align: right; margin-left: auto; /* push the content box to the right */ margin-right: 0; } [dir="rtl"] .hero-content h1 { letter-spacing: 2px; } /* ---- Section ---- */ [dir="rtl"] .section-title { letter-spacing: 1px; } [dir="rtl"] .section-sub { text-align: right; } /* ---- Collage card content ---- */ [dir="rtl"] .collage-card-content { text-align: right; left: 0; right: 0; } /* ---- Highlights ---- */ [dir="rtl"] .highlight-card { text-align: right; } [dir="rtl"] .highlight-card h4 { letter-spacing: 0; } /* ---- Stats ---- */ [dir="rtl"] .stat-item { text-align: right; } [dir="rtl"] .stat-item p { letter-spacing: 0; } /* ---- Footer ---- */ [dir="rtl"] .site-footer { direction: rtl; } [dir="rtl"] .footer-inner { direction: rtl; } [dir="rtl"] .footer-contact p { flex-direction: row-reverse; justify-content: flex-end; } [dir="rtl"] .footer-social { flex-direction: row-reverse; justify-content: flex-end; } [dir="rtl"] .footer-bottom { flex-direction: row-reverse; } [dir="rtl"] .footer-lang-switch { flex-direction: row-reverse; } /* ---- Spacing adjustments for RTL ---- */ [dir="rtl"] .hero-content p { margin-left: 0; margin-right: 0; } /* ---- Hero dots position ---- */ [dir="rtl"] .hero-dots { flex-direction: row-reverse; } /* ---- Ensure collage card text is RTL aligned ---- */ [dir="rtl"] .collage-card-content h3, [dir="rtl"] .collage-card-content p { text-align: right; } /* ---- Fix grid flow for RTL ---- */ [dir="rtl"] .highlights-grid, [dir="rtl"] .stats-grid, [dir="rtl"] .collage-grid, [dir="rtl"] .collage-row-small { direction: rtl; } /* ---- Stats section ---- */ [dir="rtl"] .stats-section { direction: rtl; }