/* ══════════════════════════════════════════════════════════════
   NEXT GITAL — version arabe (html[dir=rtl] lang=ar). Chargée uniquement en arabe (inc/i18n.php).
   Les marges, positions et alignements se retournent seuls (propriétés logiques dans site/home/pages.css) ;
   ici : typographie arabe et effets orientés (transformations, dégradés, défilement) à retourner à la main.
   ══════════════════════════════════════════════════════════════ */

/* ── Typographie ── */
/* Plus Jakarta Sans n'a pas de glyphes arabes : IBM Plex Sans Arabic prend le relais (les mots latins gardent la police de la marque). */
html[dir=rtl]{--font:"Plus Jakarta Sans","IBM Plex Sans Arabic",system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif}
html[dir=rtl] body,html[dir=rtl] .ngx{font-family:var(--font)}
/* L'interlettrage et les capitales cassent les liaisons entre les lettres arabes. */
html[dir=rtl] .ngx *,html[dir=rtl] body.ngh *{letter-spacing:normal!important;text-transform:none!important}
/* Les lettres arabes montent et descendent davantage : titres moins serrés. */
html[dir=rtl] .ngh :is(h1,h2,h3),html[dir=rtl] .ngh .h-display,html[dir=rtl] .ngh .hero__h1,html[dir=rtl] .ngh .phero__h1{line-height:1.35!important}
html[dir=rtl] .ngh :is(p,li,dd,summary,.lead){line-height:1.8}
html[dir=rtl] .ngx .caption,html[dir=rtl] .ngh .eyebrow,html[dir=rtl] .ngh .h-pre,html[dir=rtl] .ngh .caption{font-size:13px}

/* ── Flèches : elles indiquent le sens de lecture ── */
html[dir=rtl] .btn__arrow svg,html[dir=rtl] .svc__go svg,html[dir=rtl] .channel .btn__arrow svg{transform:scaleX(-1)}
html[dir=rtl] .btn:hover .btn__arrow,html[dir=rtl] .ngx .btn:hover .btn__arrow,html[dir=rtl] .related__list a:hover .btn__arrow{transform:translateX(-3px)}
html[dir=rtl] :is(.svc__main,.svc__row):hover .svc__go{transform:rotate(-45deg)}

/* ── Héros : la photo s'incline vers le texte ── */
html[dir=rtl] .hero__photo{transform:perspective(1400px) rotateY(5deg)}

/* ── Bandeau des références : défilement inchangé (noms latins) ── */
html[dir=rtl] .marquee{direction:ltr}

/* ── Fondus des images de fond : du côté opposé au texte ── */
html[dir=rtl] .svc__row::before{-webkit-mask-image:linear-gradient(270deg,transparent 40%,#000 100%);mask-image:linear-gradient(270deg,transparent 40%,#000 100%)}
html[dir=rtl] .has-ph::after{-webkit-mask-image:linear-gradient(270deg,transparent 25%,#000 85%);mask-image:linear-gradient(270deg,transparent 25%,#000 85%)}
html[dir=rtl] .final__box.has-ph::after{-webkit-mask-image:radial-gradient(120% 120% at 50% 50%,#000 30%,transparent 90%);mask-image:radial-gradient(120% 120% at 50% 50%,#000 30%,transparent 90%)}
@media (max-width:760px){html[dir=rtl] .has-ph::after{-webkit-mask-image:linear-gradient(180deg,#000,transparent 70%);mask-image:linear-gradient(180deg,#000,transparent 70%)}}

/* ── Méthode : la progression avance de droite à gauche ── */
html[dir=rtl] .process__fill{background:linear-gradient(270deg,var(--blue-500),var(--blue-300))}

/* ── Formulaires : numéros et adresses e-mail saisis de gauche à droite, alignés à droite ── */
html[dir=rtl] .ngh input[type=tel],html[dir=rtl] .ngh input[type=email],html[dir=rtl] .contact-pg__form input[type=tel],html[dir=rtl] .contact-pg__form input[type=email]{direction:ltr;text-align:right}
html[dir=rtl] .ngh input[type=tel]::placeholder,html[dir=rtl] .ngh input[type=email]::placeholder{text-align:right}

/* ── Halos de lumière : du côté où se trouve le texte ── */
html[dir=rtl] .phero{background:radial-gradient(900px 560px at 15% 10%,rgba(37,99,235,.5),transparent 62%),radial-gradient(600px 480px at 100% 100%,rgba(30,58,138,.5),transparent 60%),linear-gradient(190deg,#040a1f,#071a4a 70%,#0a2160)}
html[dir=rtl] .ngx .foot{background:radial-gradient(800px 400px at 0 0,rgba(37,99,235,.15),transparent 60%),#050b1f}

/* ── Pièges à robots des formulaires (mu-plugins/nextgital-mail.php, style en ligne left:-9999px) : en RTL, un
   débordement vers la gauche crée un défilement horizontal de 10 000 px ; on les cache du côté droit. ── */
html[dir=rtl] form div[aria-hidden="true"][style*="-9999px"]{left:auto!important;right:-9999px!important}