/* =====================================================================
   BLUEPRINT · Arabic layer — loaded only by /ar/ pages, after blueprint.css.
   The page is dir="rtl"; the grid and flex layouts mirror on their own.
   This layer handles what does not:
     1. type: the brand faces (Michroma, Hanken, Kode Mono) are latin-only.
        Fustat carries every Arabic glyph; latin runs (numbers, codes,
        brand names) keep their own faces through the fallback order.
     2. tracking: Arabic letters join, so letter-spacing is always 0.
     3. the few rules written with physical left/right.
     4. the live figures: drawn in LTR coordinates, so the SVG stays LTR
        (Arabic words inside still render right-to-left by themselves).
   ===================================================================== */
@font-face {
  font-family: 'Fustat';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/fonts/fustat-arabic.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200F, U+060C, U+061B, U+061F;
}
:root {
  --bp-f-disp: 'Michroma', 'Fustat', sans-serif;
  --bp-f-text: 'Hanken Grotesk', 'Fustat', 'Geeza Pro', 'Segoe UI', sans-serif;
  --bp-f-mono: 'Kode Mono', 'Fustat', ui-monospace, monospace;
}
html[lang='ar'] body { font-family: var(--bp-f-text); }
html[lang='ar'] *,
html[lang='ar'] *::before,
html[lang='ar'] *::after { letter-spacing: 0 !important; }

/* Arabic needs more vertical room than the latin grid */
html[lang='ar'] .bp-body,
html[lang='ar'] .bp-lead,
html[lang='ar'] p { line-height: 1.75; }
html[lang='ar'] .bp-title,
html[lang='ar'] .bp-display,
html[lang='ar'] .bp-discipline__name,
html[lang='ar'] h2,
html[lang='ar'] h3 { line-height: 1.4; font-weight: 600; }
html[lang='ar'] .bp-hero__title { line-height: 1.45; font-weight: 600; }
/* mono labels read as small Arabic text, slightly larger */
html[lang='ar'] .bp-label { font-size: 13px; }

/* physical left/right rules, mirrored */
html[dir='rtl'] .bp-nav__brand { margin-right: 0; margin-left: auto; }
html[dir='rtl'] .bp-nav .bp-btn { margin-left: 0; margin-right: clamp(8px, 1.4vw, 20px); }
html[dir='rtl'] .bp-nav .bp-lang { margin-left: 0; margin-right: clamp(4px, 1vw, 12px); }
html[dir='rtl'] .bp-hero__pre { padding-left: 0; padding-right: 0.5em; }
html[dir='rtl'] .bp-lang { direction: ltr; } /* EN · FR · IT · العربية reads the same everywhere */

/* the live figures keep their drawing direction */
html[dir='rtl'] .lf,
html[dir='rtl'] .bp-fig { direction: ltr; }
html[lang='ar'] .lf text { font-family: 'Kode Mono', 'Fustat', ui-monospace, monospace; }