/* Optimizaciones específicas para suavizar el scroll en Chrome */
main > section,
.site-footer,
.seo-services-shell,
.pulse360-section {
  content-visibility: auto;
  contain-intrinsic-size: 900px;
}

/* Evita repintados enormes en elementos fuera de pantalla */
.reveal { backface-visibility: hidden; }

/* En móviles y equipos con menos GPU, reducimos filtros costosos */
@media (max-width: 900px) {
  #nav,
  #mobile-menu,
  .solucion-block,
  .cf-card,
  .vision-ai-loader {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .hero-glow,
  .problema-card::before,
  .solucion-block::before {
    filter: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .client-logo-track,
  #vision-dots,
  .vision-loader-ring,
  .pulse360-writing i {
    animation: none !important;
  }
}

/* Segunda optimización Chrome:
   estas dos secciones son las más interactivas del primer scroll.
   Evitamos content-visibility:auto aquí para que Chrome no tenga que pintar tarde
   justo cuando el cursor entra en las cards. */
#problema,
#solucion {
  content-visibility: visible;
  contain-intrinsic-size: none;
}

/* Evita filtros costosos persistentes en las cards principales sin cambiar el look general. */
.problema-card::before,
.solucion-block::after {
  will-change: auto;
}