/* ============================================================
   deck-rtl.css, surcharges RTL pour index-ar.html.
   Chargee apres deck-v4.css, ne modifie jamais la feuille de base.
   Le sens des grilles a deux colonnes suit dir="rtl" tout seul
   (la colonne 1 part de la droite), aucune regle necessaire.
   ============================================================ */

/* Polices: l'arabe passe par Segoe UI (Aptos Display et Inter
   n'ont pas de dessin arabe complet, on evite le melange de fontes). */
body { font-family: "Segoe UI", Tahoma, Arial, sans-serif; }
.slide h1, .slide h2, .slide h3, .intake-grid strong { font-family: "Segoe UI", Tahoma, Arial, sans-serif; }

/* Espacement de lettres: toujours nul en arabe, sinon la cursive
   se decroche. Les logos latins (.text-logo) gardent le leur. */
.slide h1, .slide h2, .slide h3,
.eyebrow, .deck-chapter, .connect-group h3,
.intake-grid strong, .offer-free b { letter-spacing: 0; }

/* Hauteurs de ligne relevees pour les hampes et points de l'arabe
   (la base force .98 a 1.08, trop serre pour cette ecriture). */
.slide h1 { line-height: 1.12; }
.slide h2 { line-height: 1.15; }
.slide h3 { line-height: 1.3; }
.pivot-title { line-height: 1.12; }
.hero-title { line-height: 1.1; }

/* Alignements: la base force "left" a deux endroits. */
.deck-brand { text-align: right; }
.menu-grid button { text-align: right; }

/* Tiret decoratif des eyebrows: la marge passe a gauche du tiret,
   le trait reste avant le texte dans le sens de lecture. */
.eyebrow::before { margin: 0 0 3px 9px; }

/* Slide finale: le texte est a droite en RTL, le voile sombre
   du degrade bascule donc du cote droit, et le sujet de la photo
   est repousse vers la gauche. */
.image-shade { background: linear-gradient(270deg, rgba(4,24,37,.96) 0 38%, rgba(4,24,37,.68) 58%, rgba(4,24,37,.08)); }
.closing .full-image { object-position: 30% center; }

/* Bulles de dialogue (slide 12): coins pointus en miroir,
   la question pointe vers la droite, la reponse vers la gauche. */
.prompt { border-radius: 18px 18px 18px 4px; }
.prompt.answer { border-radius: 18px 18px 4px 18px; }

/* Pastilles de conversation: le point decoratif passe a droite. */
.talk-chips span::before { margin: 0 0 0 8px; }

/* Bandeau "+" de la slide 13: rembourrage asymetrique en miroir. */
.connect-more { padding: 10px 12px 10px 22px; }

/* Barre de controle: ancree en bas a gauche (miroir du bas droit),
   les fleches sont deja inversees dans le HTML. */
.deck-controls { inset: auto auto 16px 20px; }

/* Compteur de pages: chiffres occidentaux en ordre courant/total,
   on fige la direction pour eviter une inversion bidi. */
.slide-count { direction: ltr; }

/* Barre de progression: elle part de la droite (bloc RTL),
   le degrade suit le meme sens. */
.progress-rail span { background: linear-gradient(270deg, var(--teal), var(--aqua)); }

/* Lien d'evitement: range du cote droit. */
.skip-link { left: auto; right: 18px; }

@media (max-width: 700px) {
  /* Miroir mobile de la barre de controle. */
  .deck-controls { inset: auto auto 9px 10px; }
}