/* ============================================================
   École Venise — Styles personnalisés
   (animations, RTL, éléments non couverts par Tailwind)
   ============================================================ */

/* --- Focus clavier visible (accessibilité) --- */
a:focus-visible,
button:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

/* --- Monogramme du logo --- */
.monogram {
  color: currentColor;
}

/* --- Ondulations décoratives du hero (motif "Venise") --- */
.hero-ripples {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  color: #0a0a0a;
  opacity: 0.06;
  pointer-events: none;
}
.hero-ripples path {
  fill: none;
}

/* --- Scroll reveal --- */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}
.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Décalage progressif des cartes au sein d'une même grille */
.formation-card.reveal.is-visible,
.center-card.reveal.is-visible {
  transition-delay: calc(var(--reveal-index, 0) * 90ms);
}

/* --- Menu mobile : transition douce --- */
#mobile-nav {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
}
#mobile-nav.is-open {
  max-height: 480px;
}

/* Icône burger -> croix */
#menu-toggle.is-open .burger-bar:first-child {
  transform: translateY(4px) rotate(45deg);
}
#menu-toggle.is-open .burger-bar:last-child {
  transform: translateY(-4px) rotate(-45deg);
}

/* ============================================================
   RTL — Arabe
   ============================================================ */

/* L'arabe est une écriture cursive : le espacement des lettres et les
   majuscules cassent la liaison entre les caractères et provoquent un
   chevauchement visuel. On neutralise donc tracking/uppercase et on
   utilise une police arabe dédiée, un peu plus grasse pour rester
   lisible dans le style éditorial du site. */
[dir="rtl"] body,
[dir="rtl"] .font-nav,
[dir="rtl"] .font-display {
  font-family: "Cairo", "Segoe UI", "Tahoma", sans-serif;
}

[dir="rtl"] * {
  letter-spacing: 0 !important;
}

[dir="rtl"] .eyebrow,
[dir="rtl"] .nav-link,
[dir="rtl"] .btn-primary,
[dir="rtl"] .btn-ghost,
[dir="rtl"] .lang-switch,
[dir="rtl"] .badge-popular,
[dir="rtl"] #mobile-nav {
  text-transform: none;
}

[dir="rtl"] body {
  font-weight: 500;
}

[dir="rtl"] .font-display {
  font-weight: 600;
}

[dir="rtl"] .nav-link::after {
  left: auto;
  right: 0;
}

[dir="rtl"] .badge-popular {
  right: auto;
  left: 2rem;
}

[dir="rtl"] .center-phone,
[dir="rtl"] .monogram + span {
  direction: ltr;
  unicode-bidi: isolate;
}

/* Les numéros de téléphone restent en LTR même en contexte RTL */
[dir="rtl"] a[href^="tel:"],
[dir="rtl"] .center-phone {
  direction: ltr;
  display: inline-block;
}

/* --- Respect des préférences de mouvement réduit --- */
@media (prefers-reduced-motion: reduce) {
  .reveal {
    transition: none;
    opacity: 1;
    transform: none;
  }
  html {
    scroll-behavior: auto;
  }
  .whatsapp-float {
    transition: none;
  }
}