/* ==========================================================================
   LASDA.SITE — Correctifs d'affichage et de performance
   --------------------------------------------------------------------------
   Fichier AJOUTE. Il ne remplace rien : il se charge en dernier et corrige
   trois defauts mesures sur le site. Le supprimer remet tout comme avant.

   Mesures a l'origine de ces correctifs (page d'accueil, ecran 1280 px) :
     · 12 sections sur 18 avaient leur point de declenchement d'animation
       fausse de 800 a 1686 px  ->  sections restant vides
     · 17 backdrop-filter et 57 animations CSS tournaient en permanence,
       y compris hors ecran     ->  defilement saccade
     · l'en-tete flottant passait sous la barre d'administration WordPress
   ========================================================================== */


/* ──────────────────────────────────────────────────────────────────────────
   1 · ON ARRETE DE MENTIR SUR LA HAUTEUR DES SECTIONS
   ──────────────────────────────────────────────────────────────────────────
   `content-visibility: auto` empeche le navigateur de calculer une section
   hors ecran. Excellent pour la performance en theorie — mais la section
   annonce alors une hauteur FICTIVE (1120 px) au lieu de sa vraie hauteur.

   Or GSAP ScrollTrigger calcule ses points de declenchement a partir de la
   hauteur de la page. Avec 12 sections qui mentent, les declencheurs se
   retrouvent decales de plus de 1 000 px. Comme les animations sont reglees
   sur « une seule fois », une section depassee ne s'affiche JAMAIS.

   Mesure : sections 5 a 18, decalage de -1618 px a +1686 px.

   Le gain de performance est recupere autrement, au bloc 3 : on suspend ce
   qui coute reellement, sans toucher a la mise en page.
   ────────────────────────────────────────────────────────────────────────── */
main > section,
.et_pb_code_inner > section {
  content-visibility: visible !important;
  contain-intrinsic-size: auto !important;
}


/* ──────────────────────────────────────────────────────────────────────────
   2 · BARRE D'ADMINISTRATION WORDPRESS
   ──────────────────────────────────────────────────────────────────────────
   Connecte, WordPress affiche une barre fixe de 32 px en z-index 99999.
   L'en-tete du site est fixe en top:0 / z-index:1000 : la barre passe donc
   par-dessus et coupe le menu.

   Vos visiteurs ne voient jamais ce defaut — uniquement vous, connecte.
   ────────────────────────────────────────────────────────────────────────── */
body.admin-bar .site-header { top: 32px; }
body.admin-bar .mobile-menu { top: 32px; }

@media screen and (max-width: 782px) {
  body.admin-bar .site-header { top: 46px; }
  body.admin-bar .mobile-menu { top: 46px; }
}


/* ──────────────────────────────────────────────────────────────────────────
   3 · SECTIONS HORS ECRAN — ON SUSPEND CE QUI COUTE
   ──────────────────────────────────────────────────────────────────────────
   C'est le remplacement de `content-visibility`, sans son defaut : la
   hauteur reste exacte (donc les declencheurs restent justes), mais tout ce
   qui consomme est mis en pause.

   La classe `is-offscreen` est posee par js/perf.js.
   ────────────────────────────────────────────────────────────────────────── */

/* Les 57 animations CSS s'arretent net des que la section quitte l'ecran. */
section.is-offscreen,
section.is-offscreen *,
section.is-offscreen *::before,
section.is-offscreen *::after {
  animation-play-state: paused !important;
}

/* Les 17 backdrop-filter sont ce qui coute le plus cher au defilement :
   le compositeur redessine l'arriere-plan a chaque image. Hors ecran,
   personne ne les voit — on les coupe. */
section.is-offscreen *,
section.is-offscreen *::before,
section.is-offscreen *::after {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}


/* ──────────────────────────────────────────────────────────────────────────
   4 · FILET DE SECURITE D'AFFICHAGE
   ──────────────────────────────────────────────────────────────────────────
   Si malgre tout un declencheur ratait, js/perf.js pose cette classe et le
   contenu apparait en douceur. Aucune section ne peut plus rester vide.
   ────────────────────────────────────────────────────────────────────────── */
.lasda-revele,
.lasda-revele .split-word-inner {
  opacity: 1 !important;
  transform: none !important;
  translate: none !important;
  filter: none !important;
  transition: opacity .45s ease-out, transform .45s ease-out;
}


/* ──────────────────────────────────────────────────────────────────────────
   5 · RESPECT DE LA PREFERENCE « MOINS D'ANIMATIONS »
   Un visiteur qui a demande la reduction des animations voit tout
   immediatement, sans attendre le moindre declencheur.
   ────────────────────────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  [data-reveal],
  .js-split-words,
  .js-split-words .split-word-inner {
    opacity: 1 !important;
    transform: none !important;
    translate: none !important;
  }
}
