/* ============================================================
   PRIMETESTLAB V2 - RTL EXTRAS (hand-authored, Arabic pages)
   Loaded AFTER home-v2.rtl.css on dir="rtl" pages ONLY.
   home-v2.rtl.css is MACHINE-GENERATED from home-v2.css by
   rtlcss (see RTL_RULES.md; never edit it by hand). This file
   holds the handful of things a mechanical flip cannot do:

   1. The Arabic webfont (the V2 fonts Bricolage Grotesque and
      Inter have no Arabic glyphs). IBM Plex Sans Arabic is the
      v1 pick, loaded by the ar shells; swap the family in ONE
      place below if the owner chooses another.
   2. Letter-spacing removal: Arabic is a connected script and
      tracking breaks the letter joins. The V2 system tracks
      headings, eyebrows and mono labels, so RTL zeroes it
      globally (Latin islands lose their tracking, accepted).
   3. Directional arrow mirroring: inline SVG markup is not CSS,
      so rtlcss cannot flip it. Every directional arrow icon in
      the system is an svg.v2-ic with fill="none" (brand glyphs
      like WhatsApp/YouTube use fill="currentColor"), so the
      attribute selector below mirrors exactly the arrows.
   4. LTR islands: tokens that must render left-to-right inside
      Arabic text (package names, version strings).
   5. Arabic heading metrics (size / leading / weight only).
      Latin display ramps use weight 800 and line-height ~1.03,
      tuned for Latin capitals. Arabic needs real-weight 700
      (IBM Plex Sans Arabic has no 800 face; Chrome synthesizes
      it), looser leading for tashkeel, and a slightly smaller
      optical size so the hero wraps cleanly.
   ============================================================ */

/* 1. Arabic type. --v2-ar-font is the single swap point. */
:root {
    --v2-ar-font: "IBM Plex Sans Arabic", "Segoe UI", Tahoma, Arial, sans-serif;
}

[dir="rtl"] body.v2 {
    font-family: var(--v2-ar-font);
}

[dir="rtl"] .v2 h1,
[dir="rtl"] .v2 h2,
[dir="rtl"] .v2 h3,
[dir="rtl"] .v2-mono,
[dir="rtl"] .v2-btn {
    font-family: var(--v2-ar-font);
}

/* 2. No tracking on a connected script. */
[dir="rtl"] .v2 *,
[dir="rtl"] .v2 *::before,
[dir="rtl"] .v2 *::after {
    letter-spacing: 0 !important;
}

/* 3. Forward-pointing arrows point LEFT in RTL. The fill="none"
   attribute discriminates arrows/chevrons from brand glyphs. */
[dir="rtl"] svg.v2-ic[fill="none"] {
    transform: scaleX(-1);
}

/* The reader "next" arrows are injected by JS with the same markup. */
[dir="rtl"] .v2-reader__next svg,
[dir="rtl"] .v2-guide__go svg {
    transform: scaleX(-1);
}

/* 4. LTR islands: technical tokens inside Arabic sentences. */
[dir="rtl"] .v2-track__pkg,
[dir="rtl"] .v2-track__ver,
[dir="rtl"] .v2-how__art--file {
    direction: ltr;
    unicode-bidi: isolate;
}

/* 5. Arabic heading metrics (size / leading / weight).
   Scoped to [dir="rtl"] only; EN/other locales are untouched.
   Classes covered (from home-v2.css clamp scan of display headings):
     h1-level: .v2-hero__title, .v2-phero__title, bare .v2 h1
     h2-level: .v2-h2 (section titles), .v2-cta__title, bare .v2 h2
   h3 and below left alone (already ~1.6 leading). */

/* 5a. Leading: Latin hero is ~1.03; Arabic tashkeel needs room
   above the line and deeper descenders below. Unitless ratios
   so they track the responsive clamp ramp. */
[dir="rtl"] .v2-hero__title,
[dir="rtl"] .v2-phero__title,
[dir="rtl"] .v2 h1 {
    line-height: 1.28;
}

[dir="rtl"] .v2-h2,
[dir="rtl"] .v2-cta__title,
[dir="rtl"] .v2 h2 {
    line-height: 1.3;
}

/* 5b. Weight: kill synthetic bold. home-v2 asks for 800 on
   display h1s, but IBM Plex Sans Arabic tops out at a real 700
   (Google Fonts errors on wght@800; shells load 400;500;600;700).
   Chrome dilates the 700 outlines to fake 800, which fattens
   joins and closes counters on a connected script. 700 is the
   heaviest real face, so this is crisper, not lighter. */
[dir="rtl"] .v2-hero__title,
[dir="rtl"] .v2-phero__title,
[dir="rtl"] .v2 h1 {
    font-weight: 700;
}

/* 5c. Optical size: at the same px, Arabic fills more of the em
   box than Latin, so the home hero wraps to 3 cramped lines.
   ~12% reduction at every clamp stop (RTL only). */
[dir="rtl"] .v2-hero__title {
    font-size: clamp(2.25rem, 1.2rem + 3.1vw, 3.45rem);
}

/* Package-page hero (.v2-phero__title) has its own ramp:
   clamp(2.15rem, 1.2rem + 3.1vw, 3.45rem). Scale ~0.88. */
[dir="rtl"] .v2-phero__title {
    font-size: clamp(1.89rem, 1.06rem + 2.7vw, 3.04rem);
}