/* Right-to-left corrections for Urdu and Arabic.
   The layout is mostly logical-property based already, so this only fixes the
   places where a physical direction was hard-coded. */
[dir="rtl"] .nav a,
[dir="rtl"] .ftr-grid { text-align: right; }
[dir="rtl"] .prose ul,
[dir="rtl"] .prose ol { padding-right: 1.25em; padding-left: 0; }
[dir="rtl"] .toc ol { padding-right: 20px; padding-left: 0; }
[dir="rtl"] .crumbs span { transform: scaleX(-1); display: inline-block; }
[dir="rtl"] blockquote { border-right: 3px solid var(--green-500); border-left: 0; padding-right: 16px; padding-left: 0; }


/* Urdu type is self-hosted (2026-10-31): Noto Nastaliq Urdu (OFL), cut down to the
   Arabic-script ranges, so the browser downloads it only for Urdu text and no
   third-party stylesheet blocks the page. Arabic pages never use this family. */
@font-face { font-family: "Noto Nastaliq Urdu"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("/assets/fonts/nastaliq-regular.woff2") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+200C-200F, U+FB50-FDFF, U+FE70-FEFF; }
@font-face { font-family: "Noto Nastaliq Urdu"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("/assets/fonts/nastaliq-bold.woff2") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+200C-200F, U+FB50-FDFF, U+FE70-FEFF; }

/* Urdu: Nastaliq needs tall lines; Latin words and numbers keep the site font.
   Headings use the same family as the text (the display font has no Urdu, so a
   heading used to fall back to a different, Naskh-like face). */
html[lang="ur"] body { font-family: "Noto Nastaliq Urdu", "Jameel Noori Nastaleeq", var(--font), serif; line-height: 2.05; }
html[lang="ur"] h1, html[lang="ur"] h2, html[lang="ur"] h3 { line-height: 1.7; letter-spacing: 0; }
html[lang="ur"] h1, html[lang="ur"] h2, html[lang="ur"] h3, html[lang="ur"] h4,
html[lang="ur"] .h-hero h1, html[lang="ur"] .h-sec h2, html[lang="ur"] #faq h2 {
  font-family: "Noto Nastaliq Urdu", "Jameel Noori Nastaleeq", var(--font), serif; font-weight: 400; }
/* the header's install pill and the phone in the hero sit on the other side */
[dir="rtl"] .h-phone { right: auto; left: -28px; }
@media (max-width: 760px) { [dir="rtl"] .h-phone { left: -8px; } }
[dir="rtl"] .ftr-trust { text-align: right; }
html[lang="ur"] .btn, html[lang="ur"] .nav a, html[lang="ur"] .langpick > summary { line-height: 1.6; }

/* The skip link hides 9999px off the left. In a right-to-left page overflow on
   the left is scrollable, so it made Urdu and Arabic pages 10,000px wide and
   opened them scrolled into empty space. Hide it off the right instead. */
[dir="rtl"] .skip { left: auto; right: -9999px; }
[dir="rtl"] .skip:focus { right: 0; }