/* ================================================================= FAMILY COUNCIL — RTL / Arabic overrides Loaded when (Arabic active). Most layout already uses CSS logical properties, so this file only handles font swaps and the handful of physical-direction details. ================================================================= */ [dir="rtl"] body { font-family: var(--arabic-body); letter-spacing: 0; } [dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3, [dir="rtl"] h4, [dir="rtl"] .brand__name, [dir="rtl"] .stat__num, [dir="rtl"] .step::before, [dir="rtl"] .mv-item .num, [dir="rtl"] .card__index, [dir="rtl"] .hero h1 { font-family: var(--arabic-display); } [dir="rtl"] .hero h1 .accent { font-style: normal; } [dir="rtl"] .entry blockquote { font-style: normal; font-family: var(--arabic-display); } /* Reset Latin-tuned negative letter-spacing for Arabic */ [dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3, [dir="rtl"] .hero h1, [dir="rtl"] .section-title { letter-spacing: 0; } /* Eyebrow underline + uppercase don't translate well in Arabic */ [dir="rtl"] .eyebrow { text-transform: none; letter-spacing: .04em; } [dir="rtl"] .news-card__cat, [dir="rtl"] .info-list .label, [dir="rtl"] .brand__tag, [dir="rtl"] .site-footer h4 { text-transform: none; letter-spacing: .02em; } /* Mouse / scroll arrow flip not needed; nav underline origin */ [dir="rtl"] .nav a::after { transform-origin: right; } /* Arrow icons flip horizontally in RTL */ [dir="rtl"] .arrow { transform: scaleX(-1); } [dir="rtl"] .btn:hover .arrow { transform: scaleX(-1) translateX(4px); } [dir="rtl"] .tlink:hover .arrow { transform: scaleX(-1) translateX(4px); } /* Footer hover indent direction handled by logical padding already */