/* i18n-template-managed — refreshed by rebuild-all.sh; delete this line to hand-tune */ /* ============================================================ Right-to-left corrections for the Arabic build (/ar/). dir="rtl" on mirrors the flow; everything below fixes what is anchored to a physical side. Selectors are kept generic because these microsites do not share one design system - an unmatched selector simply does nothing. ============================================================ */ [dir="rtl"] body { text-align: right; } [dir="rtl"] ul, [dir="rtl"] ol { padding-left: 0; padding-right: 1.15rem; } /* tick bullets and numbered steps */ [dir="rtl"] .checks li, [dir="rtl"] .ticks li, [dir="rtl"] .list-check li { padding-left: 0; padding-right: 1.85rem; } [dir="rtl"] .checks li::before, [dir="rtl"] .ticks li::before, [dir="rtl"] .list-check li::before { left: auto; right: 0; transform: scaleX(-1); } [dir="rtl"] .steps li, [dir="rtl"] .numbers li { padding-left: 0; padding-right: 3.1rem; } [dir="rtl"] .steps li::before, [dir="rtl"] .numbers li::before { left: auto; right: 0; } /* breadcrumbs */ [dir="rtl"] .crumbs li + li::before, [dir="rtl"] .breadcrumb li + li::before { margin-right: 0; margin-left: .5rem; } /* tables and captions */ [dir="rtl"] caption, [dir="rtl"] th, [dir="rtl"] td { text-align: right; } /* the switcher menu flips to the other edge */ [dir="rtl"] .langsw__menu { right: auto; left: 0; text-align: right; } /* a fixed contact dock moves to the left edge */ [dir="rtl"] .dock, [dir="rtl"] .cta-dock, [dir="rtl"] .float-wa, [dir="rtl"] .floating, [dir="rtl"] .wa-float, [dir="rtl"] .fab { right: auto; left: 20px; } /* Latin fragments - part codes, emails, tolerances - stay LTR inside Arabic sentences. */ [dir="rtl"] a[href^="mailto:"], [dir="rtl"] a[href^="tel:"], [dir="rtl"] code { direction: ltr; unicode-bidi: embed; display: inline-block; } /* An off-canvas skip link parked at a negative left offset stops being clipped once the inline axis flips: it stretches the scrollable width to ~11000px and, because RTL starts at the right edge, the viewport opens on empty space and the page looks completely blank. These sites give that link whatever class they like - one uses class="btn btn-p" - so it is matched by what it actually is: a link to the main landmark. The overflow guard below is the backstop for anything else parked off-canvas, and the body should never scroll sideways in any case. */ [dir="rtl"] body { overflow-x: hidden; overflow-x: clip; } [dir="rtl"] a[href="#main"]:not(:focus), [dir="rtl"] a[href="#content"]:not(:focus), [dir="rtl"] a[href="#maincontent"]:not(:focus), [dir="rtl"] a[href="#main-content"]:not(:focus), [dir="rtl"] .skip-link:not(:focus), [dir="rtl"] .skip:not(:focus), [dir="rtl"] .skip-to-content:not(:focus), [dir="rtl"] .visually-hidden { left: auto; right: 0; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } /* uppercase tracking is meaningless in Arabic */ [dir="rtl"] .btn, [dir="rtl"] .eyebrow, [dir="rtl"] .badge, [dir="rtl"] .kicker { letter-spacing: 0; } /* cify-nav-bullets-fix-20260924 */ nav ul, .nav ul, .nav-list, .nav-ul, .nav__list, ul.nav { list-style: none; } .nav-list { list-style: none; position: relative; } nav li, .nav li, .nav-list > li, .nav-ul > li, .nav__list > li, ul.nav > li { list-style: none; } .nav-list > li { list-style: none; margin: 0; }