/* Localised home pages: the English simplified layout, with the script's own font
   and the few adjustments longer or right-to-left text needs. Translations remain
   noindex and pending native-language and compliance review. */
.localized-page { font-family: var(--localized-font); }
.localized-page h1, .localized-page h2, .localized-page h3,
.localized-page .main-nav, .localized-page .hs-btn, .localized-page .hs-link,
.localized-page .hs-list strong, .localized-page .hs-header-link,
.localized-page .language-switcher, .localized-page .site-footer { font-family: var(--localized-font); }

/* Non-Latin scripts need more line height and less negative tracking than Dosis. */
.localized-page .hs-hero h1 { font-size: clamp(36px, 4.4vw, 62px); line-height: 1.18; letter-spacing: -.01em; }
.localized-page .hs-section h2 { font-size: clamp(26px, 2.8vw, 36px); line-height: 1.25; }
.localized-page .hs-list strong { font-size: 21px; line-height: 1.35; }
.localized-page .hs-steps li::before, .localized-page .hs-list > a[aria-current="page"]::after { font-family: var(--display); }
.localized-page .hs-aside { line-height: 1.7; }

.localized-review { padding-block: 30px 60px; color: var(--muted); font-size: 13px; line-height: 1.6; }

/* Right-to-left (Dari). dir="rtl" sits on <html>, so these selectors must not be
   scoped to .localized-page — that is on <body> and the two never match together.
   The grid mirrors itself; only the arrow glyphs and the dropdown edge need help. */
[dir="rtl"] .hs-list > a::after,
[dir="rtl"] .hs-card-row::after { content: "←"; }
[dir="rtl"] .hs-list > a:hover::after { transform: translateX(-4px); }
[dir="rtl"] .hs-link::after { content: " ←"; }
[dir="rtl"] .language-options { right: auto; left: 0; }
[dir="rtl"] .hs-answer, [dir="rtl"] .tmd-result { padding: 0 20px 0 0; border-left: 0; border-right: 2px solid var(--cyan); }
[dir="rtl"] .hs-bullets { padding-left: 0; padding-right: 22px; }
[dir="rtl"] .hs-hero h1 { letter-spacing: 0; }

@media (max-width: 900px) {
  .localized-page .hs-hero h1 { font-size: clamp(32px, 8vw, 46px); }
  .localized-page .hs-section h2 { font-size: clamp(24px, 6vw, 32px); }
}