/* Rubik (Google Fonts, SIL OFL — see /fonts/Rubik-OFL.txt), self-hosted
   as its Arabic-script subset only. Persian text uses Rubik; any Latin text
   on the page (EN, handles, CGI) falls through to the site's English fonts. */
@font-face {
  font-family: "Rubik FA";
  src: url("/fonts/Rubik-Arabic-VF.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}

/* Alan Sans (Google Fonts, SIL OFL — see /fonts/AlanSans-OFL.txt) for the
   Persian titles, Arabic-script subset only, so Latin in titles keeps Syne. */
@font-face {
  font-family: "Alan Sans FA";
  src: url("/fonts/AlanSans-Arabic-VF.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}

html[dir="rtl"] {
  --display: "Alan Sans FA", "Syne", "Arial Black", sans-serif;
  --mono: "Rubik FA", "DM Mono", ui-monospace, monospace;
  font-synthesis: none;
}

html[dir="rtl"] body {
  font-family: "Rubik FA", "Manrope", system-ui, sans-serif;
  line-height: 1.8;
}

html[dir="rtl"] .brand,
html[dir="rtl"] .hero__title,
html[dir="rtl"] .section-head h2,
html[dir="rtl"] .contact__title,
html[dir="rtl"] .project__title,
html[dir="rtl"] .entry h3,
html[dir="rtl"] .about__practice li {
  letter-spacing: 0;
}

html[dir="rtl"] .eyebrow,
html[dir="rtl"] nav a,
html[dir="rtl"] .work__subhead,
html[dir="rtl"] .stage__intro,
html[dir="rtl"] .stage__hint,
html[dir="rtl"] .contact__label,
html[dir="rtl"] .site-footer,
html[dir="rtl"] .lightbox__close,
html[dir="rtl"] .lightbox__count {
  letter-spacing: 0;
}

html[dir="rtl"] .eyebrow span::before {
  content: "/";
  margin-right: 0;
  margin-left: .55rem;
}

html[dir="rtl"] .hero__title {
  font-size: clamp(2.6rem, 9.5vw, 8.4rem);
  line-height: 1.16;
}

/* Persian letters have tall dots and deep descenders: the Latin display
   line heights (.84–.92) make stacked lines collide. */
html[dir="rtl"] .section-head h2,
html[dir="rtl"] .contact__title { line-height: 1.18; }
html[dir="rtl"] .project__title { line-height: 1.1; }
html[dir="rtl"] .entry h3 { line-height: 1.3; }
html[dir="rtl"] .about__lead { line-height: 1.75; }

html[dir="rtl"] .hero__intro {
  line-height: 1.9;
}

html[dir="rtl"] .hero__down {
  right: var(--gutter);
  left: auto;
}

html[dir="rtl"] .stage__intro {
  right: var(--gutter);
  left: auto;
}

html[dir="rtl"] .stage__rail {
  right: auto;
  left: var(--gutter);
}

html[dir="rtl"] .stage__rail span {
  transform-origin: right;
}

html[dir="rtl"] .lightbox__close {
  right: auto;
  left: 1rem;
}

html[dir="rtl"] .entry__num,
html[dir="rtl"] .tags,
html[dir="rtl"] .contact__label,
html[dir="rtl"] .site-footer {
  font-variant-numeric: tabular-nums;
}

html[dir="rtl"] .latin {
  direction: ltr;
  unicode-bidi: isolate;
}

@media (min-width: 760px) {
  html[dir="rtl"] .hero__intro {
    margin-right: auto;
    margin-left: 6vw;
  }
}

/* Titles in Alan Sans: a heavier cut reads best, especially with kashida. */
html[dir="rtl"] .hero__title,
html[dir="rtl"] .section-head h2,
html[dir="rtl"] .contact__title,
html[dir="rtl"] .project__title { font-weight: 800; }
