/* Persian (Farsi) overrides — loads AFTER styles.css for fa/ pages.
   Vazirmatn replaces Inter/Cormorant/JetBrains Mono; tracking + uppercase
   removed for Persian context; italic becomes weight (no italics in Persian). */

html[lang="fa"] {
  font-family: 'Vazirmatn', system-ui, sans-serif;
}

/* Replace Latin font stacks everywhere */
html[lang="fa"] body,
html[lang="fa"] h1, html[lang="fa"] h2, html[lang="fa"] h3,
html[lang="fa"] p, html[lang="fa"] span, html[lang="fa"] div,
html[lang="fa"] a, html[lang="fa"] li, html[lang="fa"] dl,
html[lang="fa"] dt, html[lang="fa"] dd, html[lang="fa"] cite,
html[lang="fa"] blockquote, html[lang="fa"] figcaption,
html[lang="fa"] button {
  font-family: 'Vazirmatn', system-ui, sans-serif !important;
  font-style: normal !important;
}

/* Italic in Latin = weight bump in Persian */
html[lang="fa"] em,
html[lang="fa"] i,
html[lang="fa"] .hero-display em,
html[lang="fa"] .work-head h1 em,
html[lang="fa"] .about-head h1 em,
html[lang="fa"] .contact h2 em {
  font-style: normal;
  font-weight: 600;
}

/* Persian text doesn't take wide tracking or uppercase */
html[lang="fa"] .eyebrow,
html[lang="fa"] .placeholder-tag,
html[lang="fa"] .topbar-meta,
html[lang="fa"] .nav,
html[lang="fa"] .cta,
html[lang="fa"] .footer-inner,
html[lang="fa"] .piece-info .meta,
html[lang="fa"] .meta,
html[lang="fa"] .crumb,
html[lang="fa"] .small,
html[lang="fa"] .step,
html[lang="fa"] .role,
html[lang="fa"] .label,
html[lang="fa"] .hero-wall-label .meta,
html[lang="fa"] .hero-wall-label .fig,
html[lang="fa"] .index-head .small,
html[lang="fa"] .threads-head .small,
html[lang="fa"] .signoff,
html[lang="fa"] .ph-caption,
html[lang="fa"] .ph-fig,
html[lang="fa"] .portrait-note,
html[lang="fa"] .piece-num,
html[lang="fa"] .index-row .n,
html[lang="fa"] .index-row .dims,
html[lang="fa"] .spec dt,
html[lang="fa"] .detail-pager,
html[lang="fa"] .contact .ways,
html[lang="fa"] .detail-close,
html[lang="fa"] .footer {
  letter-spacing: 0;
  text-transform: none;
}

/* Display weights — Persian display reads heavier than Latin serif italic */
html[lang="fa"] .hero-display,
html[lang="fa"] .about-head h1,
html[lang="fa"] .work-head h1,
html[lang="fa"] .contact h2,
html[lang="fa"] .process h2,
html[lang="fa"] .index-head h2,
html[lang="fa"] .threads-head h2,
html[lang="fa"] .detail-side h2 {
  font-weight: 400;
  letter-spacing: -0.005em;
  line-height: 1.25;
}

html[lang="fa"] .hero-display em {
  font-weight: 600;
}

html[lang="fa"] .brand-word .name {
  font-weight: 600;
  font-size: 24px;
}
html[lang="fa"] .brand-word .prefix {
  letter-spacing: 0.06em;
  font-weight: 500;
  font-size: 11px;
}

/* Small italic-ish accents in EN → keep readable Persian */
html[lang="fa"] .index-row .title,
html[lang="fa"] .piece-info .title,
html[lang="fa"] .thread h3,
html[lang="fa"] .stages .name,
html[lang="fa"] .detail-side .statement,
html[lang="fa"] .statement-block p:first-child,
html[lang="fa"] .quote-band blockquote,
html[lang="fa"] blockquote,
html[lang="fa"] .lede,
html[lang="fa"] .hero-wall-label .title {
  font-weight: 500;
  letter-spacing: 0;
}

html[lang="fa"] .tail .num {
  font-weight: 500;
  font-style: normal;
}

/* Code-mono fonts → use Vazirmatn for these too (no Persian monospace) */
html[lang="fa"] .mono,
html[lang="fa"] code {
  font-family: 'Vazirmatn', system-ui, sans-serif !important;
}

/* RTL — arrow icons reverse */
html[dir="rtl"] .cta .arrow {
  display: inline-block;
  transform: scaleX(-1);
}
html[dir="rtl"] .cta:hover .arrow {
  transform: scaleX(-1) translateX(4px);
}

/* Statement-block accent rule — flip side */
html[dir="rtl"] .statement-block p:first-child {
  border-left: none;
  border-right: 1px solid var(--ink);
  padding-left: 0;
  padding-right: 24px;
}

/* Index row hover padding flip */
html[dir="rtl"] .index-row:hover {
  padding-left: 0;
  padding-right: 8px;
}

/* Hero wall-label fig: right column in EN, becomes left in RTL — let grid handle. */

/* Detail close-X arrow stays; "→" in source becomes natural RTL "→" pointing back. */

/* Index strip: small text right-aligned naturally with dir=rtl */

/* Increase line-height for Persian body — Persian benefits from more leading */
html[lang="fa"] p,
html[lang="fa"] .statement-block,
html[lang="fa"] blockquote {
  line-height: 1.75;
}

/* "Tabular" / index .n badge */
html[lang="fa"] .index-row .n {
  font-weight: 500;
}

/* Persian numerals via lining figures aren't needed — we type them */

/* Tail num — make it a Persian-friendly display size */
html[lang="fa"] .tail .item .num {
  font-size: 36px;
  letter-spacing: 0;
}

/* Detail spec — value column reads better with more space */
html[lang="fa"] .spec {
  grid-template-columns: 110px 1fr;
}

/* Quote band: blockquote already centered; just ensure quotes work */
html[lang="fa"] .quote-band blockquote {
  letter-spacing: 0;
}

/* "Three Verses" italic bookmark in hero — make it weight 600 */
html[lang="fa"] .hero-display em {
  font-weight: 600;
}

/* Brand mark padding — Persian wordmark needs a hair more breathing */
html[lang="fa"] .brand { gap: 14px; }
html[lang="fa"] .brand-word { gap: 10px; }

/* Lang switcher in topbar */
.lang-switch {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  color: var(--hairline);
}
.lang-switch a {
  color: var(--hairline);
  padding: 4px 2px;
  transition: color .25s ease;
}
.lang-switch a:hover { color: var(--ink); }
.lang-switch a[aria-current="true"] {
  color: var(--ink);
  border-bottom: 1px solid var(--ink);
}
.lang-switch .sep { color: var(--ink-12); }
html[lang="fa"] .lang-switch {
  font-family: 'Vazirmatn', system-ui, sans-serif;
  letter-spacing: 0;
}