/**
 * Smooth Scroll Optimization - HorizonTrading
 * Améliore la fluidité du scroll sur tous les navigateurs et devices
 */

/* ===== SCROLL FLUIDE NATIF ===== */

html {
  /* Scroll fluide pour les ancres */
  scroll-behavior: smooth;
  
  /* Optimisation GPU pour le scroll */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  
  /* Accélération matérielle */
  transform: translateZ(0);
  backface-visibility: hidden;
  perspective: 1000px;
}

body {
  /* Optimisation du rendu */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  
  /* Meilleure performance scroll */
  overflow-x: hidden;
  overflow-y: scroll;
  
  /* Force l'accélération GPU */
  transform: translate3d(0, 0, 0);
  
  /* Supprime le rebond sur iOS/Safari */
  overscroll-behavior-y: none;
}

/* ===== OPTIMISATION IMAGES & MÉDIAS ===== */

img,
video,
iframe {
  /* Évite les reflows pendant le scroll */
  will-change: transform;
  
  /* Accélération GPU */
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* ===== OPTIMISATION ANIMATIONS AU SCROLL ===== */

.reveal,
.fade-in,
[class*="animate"] {
  /* Prépare les animations pour meilleure performance */
  will-change: opacity, transform;
  
  /* Accélération GPU */
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* Nettoyer will-change après animation */
.reveal.show,
.fade-in.visible,
[class*="animate"].active {
  will-change: auto;
}

/* ===== SECTIONS & CONTAINERS ===== */

section,
.section,
.container {
  /* Isolation pour améliorer les performances */
  isolation: isolate;
}

/* ===== SCROLLBAR PERSONNALISÉE (optionnel) ===== */

/* Chrome, Edge, Safari */
::-webkit-scrollbar {
  width: 12px;
  background: #0e2336;
}

::-webkit-scrollbar-track {
  background: #0b1b2a;
  border-left: 1px solid #1f4e79;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #1f4e79, #0e2336);
  border-radius: 6px;
  border: 2px solid #0b1b2a;
  transition: background 0.2s ease;
}

::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #2a6aa3, #1f4e79);
}

::-webkit-scrollbar-thumb:active {
  background: #d4af37;
}

/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #1f4e79 #0b1b2a;
}

/* ===== OPTIMISATIONS SPÉCIFIQUES ===== */

/* Transitions fluides pour hover effects */
.card,
.btn,
a,
button {
  /* Force GPU pour transitions */
  will-change: transform;
  transform: translateZ(0);
}

.card:hover,
.btn:hover {
  /* Utilise transform au lieu de top/left */
  will-change: auto;
}

/* Optimisation des grids pendant le scroll */
.cards,
.features,
.blog,
.testimonials {
  /* Améliore le rendu des grids */
  contain: layout style paint;
}

/* ===== SCROLL SNAP (optionnel pour sections) ===== */

/* Décommenter si vous voulez un scroll snap entre sections
.scroll-snap-container {
  scroll-snap-type: y proximity;
  scroll-padding: 80px;
}

.scroll-snap-container section {
  scroll-snap-align: start;
}
*/

/* ===== FIX POUR WINDOWS/CHROME ===== */

/* Smooth scroll spécifique Windows */
@media screen and (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
  
  * {
    /* Améliore le scroll à la molette Windows */
    scroll-snap-stop: normal;
  }
}

/* ===== PERFORMANCE MOBILE ===== */

@media (max-width: 768px) {
  html {
    /* Scroll natif mobile optimisé */
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  
  body {
    /* Désactive le bounce sur iOS */
    overscroll-behavior-y: none;
  }
}

/* ===== PRÉFÉRENCES UTILISATEUR ===== */

/* Respecte les préférences d'accessibilité */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ===== OPTIMISATIONS AVANCÉES ===== */

/* Containment pour sections lourdes */
.hero,
.section,
footer {
  content-visibility: auto;
  contain-intrinsic-size: auto 500px;
}

/* Force le rendu GPU sur éléments critiques */
.nav,
header {
  will-change: transform;
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* Cleanup après sticky/fixed */
.nav {
  /* Navigation sticky optimisée */
  position: sticky;
  top: 0;
  z-index: 99;
  transform: translateZ(0);
  will-change: transform;
}

/* ===== DEBUGGING (à retirer en prod) ===== */

/* Décommenter pour débugger les problèmes de scroll
* {
  outline: 1px solid rgba(255, 0, 0, 0.1) !important;
}

*:hover {
  outline: 1px solid rgba(0, 255, 0, 0.3) !important;
}
*/
