/* RTL overrides for Arabic + Farsi pages */
html[dir="rtl"] body { font-family: "Tajawal", "Vazirmatn", "IBM Plex Sans Arabic", "Inter", -apple-system, sans-serif; }

/* === Farsi-specific spacing ===
   Persian script uses connected letterforms that get crammed when
   letter-spacing is negative (English headlines use -0.04em with
   line-height 1.0, both of which mangle Persian). !important is needed
   because the page-scoped <style> rules in src/*.html are higher
   specificity than these external stylesheet rules.
   Vazirmatn is loaded by the build script on /fa/ pages. */
html[lang="fa"] body,
html[lang="fa"] .headline,
html[lang="fa"] h1, html[lang="fa"] h2, html[lang="fa"] h3, html[lang="fa"] h4,
html[lang="fa"] p, html[lang="fa"] li, html[lang="fa"] a,
html[lang="fa"] button, html[lang="fa"] input, html[lang="fa"] textarea,
html[lang="fa"] .nav-links a, html[lang="fa"] .hero-title,
html[lang="fa"] .hero-sub, html[lang="fa"] .hero-eyebrow,
html[lang="fa"] .band-title, html[lang="fa"] .body-copy,
html[lang="fa"] .eyebrow, html[lang="fa"] .cards-header,
html[lang="fa"] .card-tile-tag {
  font-family: "Vazirmatn", "Tajawal", "IBM Plex Sans Arabic", "Inter", -apple-system, sans-serif !important;
  letter-spacing: 0 !important;
}

/* Headlines: smaller font-size + relaxed line-height so Persian breathes
   without dominating the page. English hero-title is up to 88px; that's
   far too big once you add the line-height needed for Persian descenders. */
html[lang="fa"] h1,
html[lang="fa"] h2,
html[lang="fa"] h3,
html[lang="fa"] .hero-title,
html[lang="fa"] .headline,
html[lang="fa"] .band-title,
html[lang="fa"] .cards-header h2 {
  line-height: 1.5 !important;
  letter-spacing: 0 !important;
  word-spacing: 0.04em;
}

/* Per-headline size caps — each one knocked down from its English size. */
html[lang="fa"] .hero-title     { font-size: clamp(26px, 4vw, 48px) !important; }
html[lang="fa"] .headline       { font-size: clamp(24px, 3.5vw, 40px) !important; }
html[lang="fa"] .band-title     { font-size: clamp(22px, 3vw, 36px) !important; }
html[lang="fa"] h1              { font-size: clamp(26px, 4vw, 48px) !important; }
html[lang="fa"] h2              { font-size: clamp(22px, 3vw, 36px) !important; }
html[lang="fa"] h3              { font-size: clamp(18px, 2.2vw, 26px) !important; }

/* Body copy + paragraphs — slightly smaller and looser. */
html[lang="fa"] p,
html[lang="fa"] li,
html[lang="fa"] .hero-sub,
html[lang="fa"] .body-copy {
  line-height: 1.85 !important;
  letter-spacing: 0 !important;
  font-size: 0.95em;
}

html[dir="rtl"] .nav { direction: rtl; }
html[dir="rtl"] .nav-links { flex-direction: row-reverse; }
html[dir="rtl"] .nav-logo { font-family: "Orbitron", sans-serif; }

/* Flip directional icons */
html[dir="rtl"] .arrow-right,
html[dir="rtl"] [class*="arrow-right"],
html[dir="rtl"] .nav-cta svg,
html[dir="rtl"] svg.flip-rtl { transform: scaleX(-1); }

/* Mirror absolute positioning where right/left matters */
html[dir="rtl"] .hero-mesh,
html[dir="rtl"] .grain { transform: scaleX(-1); }

/* Numbers stay LTR — common pattern for Arabic/Farsi */
html[dir="rtl"] .num,
html[dir="rtl"] .price,
html[dir="rtl"] .stat-value,
html[dir="rtl"] code,
html[dir="rtl"] kbd,
html[dir="rtl"] .mono { direction: ltr; unicode-bidi: embed; display: inline-block; }

/* The XSPA wordmark always reads left-to-right */
html[dir="rtl"] .xspa-text { direction: ltr; unicode-bidi: bidi-override; }

/* Footer columns mirrored */
html[dir="rtl"] .brand-footer-grid { direction: rtl; }
html[dir="rtl"] .brand-footer-col { text-align: right; }

/* Form inputs stay aligned to the language direction */
html[dir="rtl"] .c-form input,
html[dir="rtl"] .c-form textarea,
html[dir="rtl"] .c-form select { text-align: right; }