/* ============================================================ i18n — LTR (English) direction overrides These unlayered rules win over Tailwind's layered utilities whenever (English mode) is active. ============================================================ */ /* Right-aligned (Persian) text becomes left-aligned in English */ html.lang-en .text-right { text-align: left; } @media (min-width: 40rem) { html.lang-en .sm\:text-left { text-align: right; } } @media (min-width: 48rem) { html.lang-en .md\:text-right { text-align: left; } } @media (min-width: 64rem) { html.lang-en .lg\:text-right { text-align: left; } } /* Floating "Healthcare + Design" card: overlap the other side of the image */ html.lang-en .-right-4 { right: auto; left: -1rem; } @media (min-width: 40rem) { html.lang-en .-right-4 { left: -2rem; } } /* "Next" chevrons point right in LTR */ html.lang-en .lucide-chevron-left { transform: scaleX(-1); } /* Hero divider gradient: bright edge follows the text start side */ html.lang-en .bg-gradient-to-l { background-image: linear-gradient( to right, var(--tw-gradient-from), var(--tw-gradient-via), var(--tw-gradient-to) ); }