/* Optimización tipográfica */
body { text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* Animaciones Premium (Curvas suaves) */
.reveal { opacity: 0; transform: translateY(40px); transition: opacity 0.9s cubic-bezier(0.25, 1, 0.5, 1), transform 0.9s cubic-bezier(0.25, 1, 0.5, 1); will-change: opacity, transform; }
.reveal.active { opacity: 1; transform: translateY(0); }

.reveal-left { opacity: 0; transform: translateX(-40px); transition: opacity 0.9s cubic-bezier(0.25, 1, 0.5, 1), transform 0.9s cubic-bezier(0.25, 1, 0.5, 1); will-change: opacity, transform; }
.reveal-left.active { opacity: 1; transform: translateX(0); }

.reveal-right { opacity: 0; transform: translateX(40px); transition: opacity 0.9s cubic-bezier(0.25, 1, 0.5, 1), transform 0.9s cubic-bezier(0.25, 1, 0.5, 1); will-change: opacity, transform; }
.reveal-right.active { opacity: 1; transform: translateX(0); }

.reveal-zoom { opacity: 0; transform: scale(0.95); transition: opacity 0.9s cubic-bezier(0.25, 1, 0.5, 1), transform 0.9s cubic-bezier(0.25, 1, 0.5, 1); will-change: opacity, transform; }
.reveal-zoom.active { opacity: 1; transform: scale(1); }

/* Tarjetas interactivas */
.card-ui { transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.4s cubic-bezier(0.25, 1, 0.5, 1), border-color 0.4s ease; }
.card-ui:hover { transform: translateY(-8px); box-shadow: var(--tw-shadow-premium); border-color: #cbd5e1; }

/* Efecto Imagen */
.img-zoom { transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1); will-change: transform; }
.card-ui:hover .img-zoom, .group:hover .img-zoom { transform: scale(1.04); }

/* Efecto Brillo Botones */
.btn-shine { position: relative; overflow: hidden; }
.btn-shine::after {
    content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%;
    background: rgba(255,255,255,0.15); transform: rotate(45deg) translateY(-100%);
    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}
.btn-shine:hover::after { transform: rotate(45deg) translateY(100%); }

/* Mejoras de Accesibilidad */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid #10B981; outline-offset: 2px; }

/* Ocultar barra de desplazamiento para sliders en mobile */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }