/* =====================================================================
   PERSIAN TYPOGRAPHY

   Persian is a connected script: letters join, and the joins carry the
   word's shape. Several habits that improve Latin display type actively
   damage it — this file corrects them and sets the metrics Persian
   actually needs.

   Loaded after style.css so it wins, and scoped to [lang="fa"] so the
   English version keeps normal Latin typography.
   ===================================================================== */

[lang="fa"] {
  /* Vazirmatn's Persian digits are well-drawn; use them where the font
     offers a choice, and keep tabular figures so numbers line up. */
  font-feature-settings: "ss01", "tnum";
  font-variant-numeric: tabular-nums;
}

/* ---------------------------------------------------------------
   1. NEVER letter-space Persian.
   Negative tracking collapses the joins between letters; positive
   tracking breaks them apart entirely. Both make the word unreadable
   in a way that looks merely "tight" to someone reading Latin.
   --------------------------------------------------------------- */
[lang="fa"] h1,
[lang="fa"] h2,
[lang="fa"] h3,
[lang="fa"] h4,
[lang="fa"] p,
[lang="fa"] li,
[lang="fa"] a,
[lang="fa"] b,
[lang="fa"] button,
[lang="fa"] .btn,
[lang="fa"] .act h2,
[lang="fa"] .cine-hero h1,
[lang="fa"] .hero h1,
[lang="fa"] .scorer-copy h2,
[lang="fa"] .page-hero h1 {
  letter-spacing: 0 !important;
}

/* A Latin run inside Persian may still be tracked — that is where
   tracking belongs. */
[lang="fa"] .lat,
[lang="fa"] .eyebrow,
[lang="fa"] .act-eyebrow {
  letter-spacing: normal;
}
[lang="fa"] .act-eyebrow { letter-spacing: .14em }   /* Latin label, fine */

/* ---------------------------------------------------------------
   2. Persian needs more leading than Latin.
   Its ascenders, descenders and the dots below letters (ژ چ ی) occupy
   more vertical space, so lines collide at Latin line-heights.
   --------------------------------------------------------------- */
[lang="fa"] body,
[lang="fa"] p,
[lang="fa"] li,
[lang="fa"] .act-lead,
[lang="fa"] .cine-hero-lead { line-height: 2.05 }

[lang="fa"] h1 { line-height: 1.5 }
[lang="fa"] h2 { line-height: 1.55 }
[lang="fa"] h3, [lang="fa"] h4 { line-height: 1.7 }

/* Headings also need a touch more weight to hold their colour at the
   same optical size as Latin. */
[lang="fa"] h1 { font-weight: 800 }
[lang="fa"] h2 { font-weight: 700 }

/* ---------------------------------------------------------------
   3. Mixed Persian + Latin
   Persian and Latin have different side bearings, so an English product
   name inside a Persian sentence crowds its neighbours. A small margin
   and an isolated bidi context fix both the spacing and the ordering.
   --------------------------------------------------------------- */
.lat {
  unicode-bidi: isolate;
  margin-inline: .12em;
  font-feature-settings: normal;
}
/* Numbers, prices and codes stay Latin and stay LTR wherever they sit. */
.num, [lang="fa"] .num {
  unicode-bidi: isolate;
  direction: ltr;
  font-variant-numeric: tabular-nums;
  margin-inline: .1em;
}

/* ---------------------------------------------------------------
   4. RTL alignment that is designed, not mirrored
   --------------------------------------------------------------- */
[dir="rtl"] .act-lead,
[dir="rtl"] .cine-hero-lead,
[dir="rtl"] p { text-align: start }

/* Persian text should not be justified: the script stretches through
   kashida, and browsers fake it by opening word gaps into rivers. */
[lang="fa"] p, [lang="fa"] .act-lead { text-align: start; text-justify: none }

/* The eyebrow rule sits on the correct side and grows the right way. */
[dir="rtl"] .act-eyebrow::before { order: 2 }

/* Lists: the marker belongs on the right, and the indent with it. */
[dir="rtl"] .service-list li { padding-inline-start: 26px; padding-inline-end: 0 }
[dir="rtl"] .service-list li::before { inset-inline-start: 0; inset-inline-end: auto }

/* ---------------------------------------------------------------
   5. Persian punctuation
   Persian uses ، ؛ ؟ and « ». They are already in the copy; these rules
   keep the guillemets from colliding with the words they enclose.
   --------------------------------------------------------------- */
[lang="fa"] { quotes: "«" "»" "‹" "›" }
[lang="fa"] q::before { content: open-quote; margin-inline-end: .06em }
[lang="fa"] q::after  { content: close-quote; margin-inline-start: .06em }

/* ---------------------------------------------------------------
   6. Forms and inputs
   A Persian field should start on the right — but an email, a URL or a
   channel address is Latin and must stay LTR, or the cursor jumps.
   --------------------------------------------------------------- */
[dir="rtl"] input[type="text"],
[dir="rtl"] textarea,
[dir="rtl"] select { text-align: start }
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="number"],
input[type="password"],
.ltr-field { direction: ltr; text-align: left }

/* ---------------------------------------------------------------
   7. Buttons holding English technical terms
   "PDF" or "YouTube" inside a Persian button label must not flip the
   whole label's order.
   --------------------------------------------------------------- */
[lang="fa"] .btn { letter-spacing: 0; font-weight: 700 }
[lang="fa"] .btn .lat { unicode-bidi: isolate }

/* ---------------------------------------------------------------
   8. Mobile RTL
   --------------------------------------------------------------- */
@media (max-width: 620px) {
  [lang="fa"] body { line-height: 2 }
  [lang="fa"] h1 { line-height: 1.55 }
  /* Persian at small sizes loses its dots; hold a slightly larger floor. */
  [lang="fa"] small, [lang="fa"] .act-lead { font-size: max(12.5px, 1em) }
}

/* ---------------------------------------------------------------
   9. English mode keeps Latin typography
   --------------------------------------------------------------- */
[lang="en"] h1 { letter-spacing: -.02em }
[lang="en"] h2 { letter-spacing: -.01em }
[lang="en"] body, [lang="en"] p { line-height: 1.75 }

/* Language switch — deliberately quiet: Persian is the product, English
   is a courtesy, so it is a text link, not a flag or a big toggle. */
.lang-switch{font-size:12px;color:#8b90a0;text-decoration:none;padding:6px 10px;border-radius:8px;
  border:1px solid transparent;margin-inline-end:6px;white-space:nowrap}
.lang-switch:hover{color:#fff;border-color:var(--line)}
.lang-switch:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* Language toggle: both options visible, the current one marked. */
.lang-toggle{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-inline-end:8px;flex:none}
.lang-toggle a{font-size:12px;padding:6px 11px;color:#9aa0ae;text-decoration:none;white-space:nowrap;line-height:1.4}
.lang-toggle a.is-on{background:rgba(255,201,40,.14);color:#fff;font-weight:700}
.lang-toggle a:hover{color:#fff}
.lang-toggle a:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.lang-toggle a[lang="en"]{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}