html[dir="rtl"] body { text-align: right; }

html[dir="rtl"] .no-list li { padding-left: 0; padding-right: 1.7rem; }
html[dir="rtl"] .no-list li::before { left: auto; right: 0; }

html[dir="rtl"] .step { padding-left: 0; padding-right: 3rem; }
html[dir="rtl"] .step::before { left: auto; right: 0; }

html[dir="rtl"] .lang-switch-menu { right: auto; left: 0; }

html[dir="rtl"] .card-top,
html[dir="rtl"] .hero-actions,
html[dir="rtl"] .footer-base { text-align: right; }

html[dir="rtl"] .brand { flex-direction: row-reverse; }
html[dir="rtl"] .lang-switch-toggle { flex-direction: row-reverse; }
html[dir="rtl"] .lang-switch-menu a { flex-direction: row-reverse; }

@media (max-width: 720px) {
  html[dir="rtl"] .nav-toggle { margin-left: 0; margin-right: auto; }
}