/* ── Arabic RTL foundation ─────────────────────────────────────────────
   Loaded on lang="ar" pages only. Layout direction comes from dir="rtl";
   this sheet handles typography, letter-spacing (which breaks joined
   Arabic script), arrow mirroring and component alignment. */

[dir="rtl"] body,
[dir="rtl"] p,
[dir="rtl"] .sp-text,
[dir="rtl"] .book-why,
[dir="rtl"] .proof-item-desc,
[dir="rtl"] .sp-relevance-item-desc {
    font-family: 'IBM Plex Sans Arabic', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    line-height: 1.9;
}

[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] .sp-title,
[dir="rtl"] .sp-section-title,
[dir="rtl"] .book-title,
[dir="rtl"] .sp-diverge-title,
[dir="rtl"] .sp-relevance-title {
    font-family: 'Amiri', 'Source Serif 4', Georgia, 'Times New Roman', serif;
}

/* Letter-spacing visually disconnects joined Arabic letters — remove it */
[dir="rtl"] .eyebrow,
[dir="rtl"] .nav a,
[dir="rtl"] .nav-logo,
[dir="rtl"] .nav-back,
[dir="rtl"] footer,
[dir="rtl"] .sp-footer-text,
[dir="rtl"] .sp-meta-key,
[dir="rtl"] .sp-meta-val,
[dir="rtl"] .book-num,
[dir="rtl"] .book-author,
[dir="rtl"] .book-arrow,
[dir="rtl"] .data-key,
[dir="rtl"] .data-val,
[dir="rtl"] .sp-diverge-label,
[dir="rtl"] .sp-diverge-book-label,
[dir="rtl"] .sp-diverge-evidence-label,
[dir="rtl"] .sp-relevance-label,
[dir="rtl"] .sp-relevance-item-title,
[dir="rtl"] .proof-item-title,
[dir="rtl"] .lang-switch a,
[dir="rtl"] .sp-subtitle,
[dir="rtl"] .skip-link {
    letter-spacing: 0 !important;
}

/* Monospace eyebrows/labels carry Arabic text now — swap family */
[dir="rtl"] .eyebrow,
[dir="rtl"] .sp-meta-key,
[dir="rtl"] .book-num,
[dir="rtl"] .lang-switch a,
[dir="rtl"] .sp-footer-text,
[dir="rtl"] footer,
[dir="rtl"] .sp-diverge-label,
[dir="rtl"] .sp-relevance-label {
    font-family: 'IBM Plex Sans Arabic', 'JetBrains Mono', ui-monospace, monospace;
}

/* Mirror directional glyphs */
[dir="rtl"] .nav-back-arrow,
[dir="rtl"] .sp-link-arrow {
    display: inline-block;
    transform: scaleX(-1);
}

/* Tables / meta grids: right-align keys */
[dir="rtl"] .data-key,
[dir="rtl"] .sp-meta-key {
    text-align: right;
}
[dir="rtl"] .data-row {
    direction: rtl;
}

/* 3D book spine flips to the right edge */
[dir="rtl"] .sp-book-inner::before,
[dir="rtl"] .book-cover-inner::before {
    left: auto;
    right: 0;
}

/* 404 page specifics (inline styles overridden) */
[dir="rtl"] .box { text-align: center; }
[dir="rtl"] .rule { margin: 22px auto; }

/* ── Horizontal containment ──────────────────────────────────────────
   RTL makes left-side overflow scrollable; the two marquee tracks would
   otherwise open a blank horizontal canvas and break first paint. */
html[dir="rtl"],
html[dir="rtl"] body {
    overflow-x: hidden;
}
html[dir="rtl"] .data-strip-wrap,
html[dir="rtl"] .institutions-track-wrap {
    overflow: hidden;
    max-width: 100vw;
}
/* Elements parked off-screen LEFT are scrollable in RTL (scroll range grows
   toward negative x) — mirror them to the right, which RTL clips. */
html[dir="rtl"] .skip-link {
    left: auto !important;
    right: -9999px;
}
html[dir="rtl"] .skip-link:focus {
    left: auto !important;
    right: 0;
}

/* D3 — Arabic display-size tuning: longer words + deep descenders need
   more line-height and slightly smaller clamps at display sizes. */
[dir="rtl"] .hero-name { font-size: clamp(2.6rem, 6vw, 5.5rem); line-height: 1.4; }
[dir="rtl"] .sp-title { font-size: clamp(1.9rem, 4.5vw, 3.2rem); line-height: 1.45; }
[dir="rtl"] .hd { line-height: 1.4; }
[dir="rtl"] .interlude-text { line-height: 1.8; }

/* D4 — marquee reads right-to-left on RTL pages */
[dir="rtl"] .data-strip-track { animation-direction: reverse; }

/* D6 — Arabic glyphs run wider: give buttons/chips a touch more inline room */
[dir="rtl"] .hero-cta,
[dir="rtl"] .hero-cta-secondary,
[dir="rtl"] .btn-cv { padding-inline: calc(2rem + 0.25em); }
[dir="rtl"] .badge { padding-inline: calc(var(--sp-3) + 0.25em); }
