/* ==========================================================================
   Endogeni — surcharges pour l'arabe (RTL)
   Chargée uniquement par /ar/. Les sélecteurs restent préfixés [dir="rtl"]
   pour rester lisibles et sans effet si la feuille est chargée ailleurs.

   Le gros du miroir est gratuit : la mise en page repose sur flex, grid et
   des propriétés logiques, qui suivent déjà le sens de lecture. Ne reste ici
   que ce qu'aucune règle logique ne couvre.
   ========================================================================== */

/* --- Latin allégé -----------------------------------------------------------
   La page arabe n'affiche qu'une quarantaine de caractères latins : le
   logotype, les numéros de section, le SIREN, l'adresse e-mail et les codes
   FR/EN/AR. Charger pour ça les 58 Ko de Michroma et Lexend complets — leurs
   accents, leurs symboles, leur ponctuation étendue — n'a pas de sens.

   Ces deux déclarations portent les MÊMES noms de famille que celles de
   tokens.css, mais arrivent après (rtl.css n'est chargée que par /ar/). Pour
   les codes qu'elles couvrent, c'est la dernière déclaration qui gagne : la
   page arabe prend donc les sous-ensembles ASCII, et les pages latines ne
   sont pas touchées. Si un caractère accentué apparaissait un jour ici, il
   sortirait de cette plage et déclencherait le fichier complet : la reprise
   se fait toute seule, aucun glyphe ne peut manquer.
   La plage part de U+0000 et non de U+0020 : les sauts de ligne du code
   HTML sont des caractères comme les autres pour le navigateur, et un
   U+000A hors plage suffisait à lui faire télécharger Lexend en entier —
   39 Ko pour afficher un retour à la ligne.
   Les quatre graisses de Lexend sont redéclarées une à une, et non en une
   seule plage 100-900 : tokens.css les déclare séparément, et une plage ne
   l'emporte pas sur une correspondance exacte de graisse — le navigateur
   retombait alors sur le fichier complet.
   35 Ko au lieu de 58.
   -------------------------------------------------------------------------- */
@font-face {
  font-family: 'Michroma';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/michroma-ascii.woff2) format('woff2');
  unicode-range: U+0000-007E, U+00A0, U+00B7, U+2013-2014, U+2018-2019, U+201C-201D, U+2190-2193, U+20AC, U+2122;
}

@font-face {
  font-family: 'Lexend';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/assets/fonts/lexend-ascii.woff2) format('woff2');
  unicode-range: U+0000-007E, U+00A0, U+00B7, U+2013-2014, U+2018-2019, U+201C-201D, U+2190-2193, U+20AC, U+2122;
}
@font-face {
  font-family: 'Lexend';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/lexend-ascii.woff2) format('woff2');
  unicode-range: U+0000-007E, U+00A0, U+00B7, U+2013-2014, U+2018-2019, U+201C-201D, U+2190-2193, U+20AC, U+2122;
}
@font-face {
  font-family: 'Lexend';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/lexend-ascii.woff2) format('woff2');
  unicode-range: U+0000-007E, U+00A0, U+00B7, U+2013-2014, U+2018-2019, U+201C-201D, U+2190-2193, U+20AC, U+2122;
}
@font-face {
  font-family: 'Lexend';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/lexend-ascii.woff2) format('woff2');
  unicode-range: U+0000-007E, U+00A0, U+00B7, U+2013-2014, U+2018-2019, U+201C-201D, U+2190-2193, U+20AC, U+2122;
}

/* --- Typographie -----------------------------------------------------------
   L'interlettrage est INTERDIT en arabe : il casse les liaisons entre les
   lettres d'un même mot. Les deux variables d'espacement passent donc à
   `normal`, ce qui neutralise d'un coup les titres et les libellés de
   section (`text-transform: uppercase` y est de toute façon sans effet).
   L'arabe a aussi besoin de plus d'air vertical : ses hampes et ses points
   diacritiques débordent d'un interlignage pensé pour l'alphabet latin.
   -------------------------------------------------------------------------- */
[dir="rtl"] {
  --track-display: normal;
  --track-label: normal;

  /* Le texte secondaire passe de l'indigo clair à l'indigo plein.
     #4B5280 tient très bien sous les pleins et déliés du latin, mais les
     traits de Cairo sont trop fins pour le porter : à l'œil, le texte
     arabe paraissait délavé. Le contraste passe de 7:1 à 14:1.
     Ce n'est pas du noir — c'est l'indigo de la charte, simplement utilisé
     partout plutôt que réservé aux titres. */
  --c-ink-soft: #161B3F;
}

[dir="rtl"] body { line-height: 1.85; }

/* Reem Kufi monte et descend plus que Michroma : les titres arabes ont
   besoin de plus d'air que l'interlignage de 1,12 prévu pour le latin. */
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] .display,
[dir="rtl"] .card__title,
[dir="rtl"] .citation__quote,
[dir="rtl"] .moteur__core-title,
[dir="rtl"] .domaines__banner-text { line-height: 1.5; }

/* Les titres sont en Reem Kufi, dont l'œil est un peu plus petit que celui
   de Michroma : à corps égal, ils paraissent plus menus. On les remonte
   légèrement. Le texte courant, lui, est en Cairo, dont l'œil est plus
   grand : il n'a besoin d'aucune correction de corps. */
[dir="rtl"] .hero__title { font-size: calc(var(--fs-h1) * .95); max-width: 20ch; }
[dir="rtl"] .section-title { font-size: calc(var(--fs-h2) * .98); }
[dir="rtl"] .citation__quote { max-width: 26ch; }

/* Les chiffres restent latins et gardent leur graisse d'origine. */
[dir="rtl"] .num { letter-spacing: var(--track-display); }

/* --- Graisses ---------------------------------------------------------------
   Reem Kufi et Cairo ont un trait sensiblement plus fin que Michroma et
   Lexend : à graisse égale, l'arabe paraît anémique à côté du latin. Le 400
   des titres et le 300 du texte, qui tiennent très bien en latin, ne tiennent
   pas ici. On remonte chaque rôle de deux crans.
   Les deux familles arabes sont variables, donc ces graisses ne coûtent
   aucun octet supplémentaire.
   -------------------------------------------------------------------------- */
[dir="rtl"] body { font-weight: 500; }

[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] .display,
[dir="rtl"] .card__title,
[dir="rtl"] .citation__quote,
[dir="rtl"] .moteur__core-title,
[dir="rtl"] .domaines__banner-text { font-weight: 700; }

[dir="rtl"] .lead { font-weight: 500; }
[dir="rtl"] .card__text,
[dir="rtl"] .moteur__tile-text,
[dir="rtl"] .section-head__aside,
[dir="rtl"] .hero__fact-text,
[dir="rtl"] .moteur__item { font-weight: 500; }

[dir="rtl"] .btn,
[dir="rtl"] .domaines__banner-pill,
[dir="rtl"] .moteur__tile-title { font-weight: 700; }

[dir="rtl"] .site-nav__link { font-weight: 600; }
[dir="rtl"] .site-nav__link.is-current { font-weight: 700; }

/* Le texte secondaire est déjà en indigo clair : à 300 et en Cairo, le
   contraste devenait trop faible pour être confortable. */
[dir="rtl"] .site-footer__inner { font-weight: 500; }

/* Les libellés de section et les pastilles sont déjà en 600 ; en Cairo, ce
   n'est pas assez pour de si petits corps en capitales inexistantes. */
[dir="rtl"] .section-label,
[dir="rtl"] .hero__fact-label,
[dir="rtl"] .domaines__badge,
[dir="rtl"] .chip { font-weight: 700; }

/* Les chiffres restent latins, donc en Michroma : ne pas y toucher. */
[dir="rtl"] .num { font-weight: 400; }

/* --- Éléments directionnels -------------------------------------------------
   Les orbes sont décoratifs : on les remet du côté qui suit la lecture.
   -------------------------------------------------------------------------- */
[dir="rtl"] .orb--page-left  { left: auto;  right: -280px; }
[dir="rtl"] .orb--page-right { right: auto; left:  -300px; }
[dir="rtl"] .moteur__core-orb { right: auto; left: -90px; }
[dir="rtl"] .domaines__orb    { right: auto; left: -100px; }
[dir="rtl"] .contact__orb     { right: auto; left: -130px; }

/* Les colonnes du schéma s'inversent toutes seules (grille en RTL) : les
   courbes doivent suivre, sinon elles partiraient à contresens. */
[dir="rtl"] .moteur__wire svg { transform: scaleX(-1); }

/* --- Ce qui ne se retourne PAS ----------------------------------------------
   Le « e » est une marque, pas un signe de ponctuation : il garde son sens.
   Le logotype porte déjà dir="ltr" dans le partial ; on protège ici le grand
   « e » du hero, les marques du moteur, de la citation et du pied de page.
   -------------------------------------------------------------------------- */
[dir="rtl"] .hero-e,
[dir="rtl"] .logotype__mark,
[dir="rtl"] .moteur__core-mark,
[dir="rtl"] .citation__mark,
[dir="rtl"] .site-footer__mark { direction: ltr; }

/* L'adresse e-mail est une chaîne latine : elle se lit de gauche à droite. */
[dir="rtl"] .contact__email { direction: ltr; text-align: end; }

/* --- Ajustements de composants ------------------------------------------- */
/* « + ذكاء اصطناعي » est bien plus long que « + IA » : on desserre la pastille
   et on l'empêche de comprimer le numéro. */
[dir="rtl"] .domaines__badge { font-size: 11px; padding: 5px 10px; white-space: nowrap; }
[dir="rtl"] .domaines__top { gap: 12px; }

/* Le chiffre et le libellé du menu restent lisibles malgré l'interlignage
   élargi du corps de texte. */
[dir="rtl"] .site-nav__link,
[dir="rtl"] .lang-switch__item,
[dir="rtl"] .btn { line-height: 1.4; }

/* Les codes de langue (FR/EN/AR) sont latins. */
[dir="rtl"] .lang-switch { direction: ltr; }