/* ============================================================
   TALANTA — Arabic pages (phase 07)
   Loaded after blocks.css only on right-to-left pages (inc/i18n.php), together with
   Bootstrap's RTL build, so English pages never see these rules.
   talanta.css and the page CSS already use logical properties and carry [dir="rtl"] rules
   (outcomes, preloader thread, logo marquee, footer ↗, approach bars and pins). This file adds
   the Arabic type and mirrors the remaining direction-bound details. Additions only.
   ============================================================ */

/* ---------------- Arabic type ----------------
   Stack and adjustments from the bilingual draft talanta-homepage-bootstrap.html
   (lines 31–36, 76, 84–86, 102, 301, 322): IBM Plex Sans Arabic first, a taller
   line height, lighter tracking. The font files are the theme's own (theme.json "arabic"). */
html[lang|="ar"]{
  --font-arabic: var(--wp--preset--font-family--arabic);
  --bs-body-font-family: var(--font-arabic);
  --bs-body-line-height: 1.9;
}
html[lang|="ar"] .eyebrow{ font-family: var(--font-arabic); letter-spacing: .12em; }
html[lang|="ar"] :is(h1, h2, h3, .h1, .h2, .h3){ font-weight: 700; letter-spacing: 0; line-height: 1.45; }
html[lang|="ar"] .btn{ letter-spacing: .04em; font-size: .95rem; }
html[lang|="ar"] .tal-form .form-label{ letter-spacing: 0; }
html[lang|="ar"] .foot-h{ letter-spacing: .06em; }

/* header: the Discovery Session button keeps its label on one line when the menu labels are long
   (with the long placeholders, 768 px broke "استكشافية" inside the word); the menu links wrap instead */
[dir="rtl"] .site-nav .nav-cta-btn{ white-space: nowrap; }

/* The Latin brand marks stay left to right inside Arabic text (draft line 64: .latin) */
[dir="rtl"] :is(.tal-word, .mark-3a){ direction: ltr; unicode-bidi: isolate; }

/* ---------------- mirrored details ---------------- */
/* home hero: the shade is darkest behind the caption, which now starts on the right (the photo's ::after, phase 11) */
[dir="rtl"] .slide-media::after{ background: linear-gradient(260deg, rgba(8,23,41,.88) 15%, rgba(8,23,41,.55) 55%, rgba(8,23,41,.35)); }
/* below 1200 px the stronger shade of blocks.css (phase 08, caption contrast), mirrored */
@media (max-width: 1199.98px){
  [dir="rtl"] .hero-carousel .slide-media::after{ background: linear-gradient(260deg, rgba(8,23,41,.88) 15%, rgba(8,23,41,.82) 55%, rgba(8,23,41,.78)); }
}
/* home hero: the slide indicator fills in reading direction */
[dir="rtl"] .hero-carousel .splide .splide__pagination__page::after{ transform-origin: right; }
/* home hero slider (phase 11): the Splide Carousel Block's right-to-left stylesheet turns Splide's direction:rtl into
   ltr (a plugin bug), and places the arrows for the plugin's own layout. The slider reads right to left: previous on
   the right, next on the left, as Bootstrap's RTL carousel did (their icons point that way, home.css) */
[dir="rtl"] .hero-carousel .splide.splide--rtl{ direction: rtl; }
[dir="rtl"] .hero-carousel .splide .splide__arrows--rtl .splide__arrow--prev{ right: 0; left: auto; }
[dir="rtl"] .hero-carousel .splide .splide__arrows--rtl .splide__arrow--next{ left: 0; right: auto; }
/* home methodology: the gold line draws in reading direction */
[dir="rtl"] .pillar-line{ transform-origin: right; }
/* home service cards: the "Explore" arrow points forward (left) and nudges forward on hover */
[dir="rtl"] .pc-cta::after{ transform: scaleX(-1); }
[dir="rtl"] .photo-card:hover .pc-cta::after{ transform: translateX(-5px) scaleX(-1); }
/* home industries strip: the row starts at the right, so the loop scrolls the other way */
[dir="rtl"] .marquee{ animation-name: marquee-rtl; }
@keyframes marquee-rtl{ to{ transform: translateX(50%); } }
/* services: the practice illustrations show progress toward the reading direction (strategy and
   transformation arrows, the performance chart); governance is symmetric */
[dir="rtl"] .svc-art svg{ transform: scaleX(-1); }
/* contact details: phone numbers read left to right ("+973 …"), as the footer's <span dir="ltr"> does */
[dir="rtl"] .info-val a:is([href^="tel:"], [href*="wa.me/"]){ direction: ltr; unicode-bidi: isolate; }
/* approach, TALANTA ONE pipeline: the chevrons point forward (left) */
[dir="rtl"] .pipeline li{
  padding: 1rem 1.25rem 1rem 1.75rem;
  clip-path: polygon(100% 0, 14px 0, 0 50%, 14px 100%, 100% 100%);
}