/**
 * Optimisations CSS pour améliorer les performances du scroll
 * Particulièrement pour le premier scroll
 */

/* Optimisation globale pour le scroll */
html {
  scroll-behavior: smooth;
  /* Optimisation du rendu pendant le scroll */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Réduire le coût du repaint pendant le scroll */
body.is-scrolling {
  pointer-events: none;
}

body.is-scrolling *:not(.testimonials-slider-track):not(.animated-cursor):not(.generate-button):not(.generate-animation-container *):not(.chevron):not(.neon-arrow-separator *) {
  animation-play-state: paused !important;
}

/* CORRECTION: Forcer la continuité des animations critiques pendant le scroll */
body.is-scrolling .testimonials-slider-track,
body.is-scrolling .animated-cursor,
body.is-scrolling .generate-animation-container *,
body.is-scrolling .chevron,
body.is-scrolling .neon-arrow-separator * {
  animation-play-state: running !important;
}

/* Optimisations pour les sections critiques */
#feature-section-4,
#feature-section-5 {
  /* Isolation du contexte de rendu */
  contain: layout style paint;
  /* Optimisation GPU */
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* Optimisation des animations de bulles */
.client-bubble,
.central-bubble,
.task-item {
  will-change: auto; /* Sera activé dynamiquement quand nécessaire */
  contain: layout style;
}

/* Optimisation pour les animations en cours */
.client-bubble.floating {
  will-change: transform;
}

.task-item.visible {
  will-change: opacity, transform;
}

/* Réduire le coût des ombres complexes */
.card-visual {
  /* Utiliser une ombre simple au lieu de multiples */
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
}

/* Optimisation pour les images */
.client-bubble img {
  /* Empêcher le reflow pendant le chargement */
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Optimisation du rendu */
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}

/* Optimiser les transitions */
.task-checkbox,
.task-line {
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* Désactiver les animations hors vue, sauf pour les éléments d'animation spécifiques */
.section:not(.in-view) *:not(.content-line) {
  animation: none !important;
  transition: none !important;
}

/* Optimisation de la mémoire pour les éléments cachés */
.client-bubble:not(.floating),
.task-item:not(.visible) {
  will-change: auto;
  transform: none;
}

/* Optimisation spécifique pour le premier render */
@media (prefers-reduced-motion: no-preference) {
  /* Précharger les transformations critiques */
  .task-animation-container,
  .generate-animation-container {
    transform: translateZ(0);
  }
}

/* Optimisation pour mobile */
@media (max-width: 768px) {
  /* Réduire la complexité sur mobile */
  .client-bubble,
  .task-item {
    box-shadow: none;
  }
  
  /* Désactiver certaines animations sur mobile */
  .bubble-glow,
  .task-line::after {
    display: none;
  }
}