body {
    font-family: 'Inter', sans-serif;
    background: #020617; /* Fondo general más oscuro (Slate 950) para maximizar contraste */
    color: #f8fafc;
}

/* Glassmorphism UX - Contraste Real y Efectivo */
.glass {
    background: rgba(30, 41, 59, 0.95); /* Fondo de tarjeta mucho más claro y casi opaco (Slate 800) */
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.15); /* Borde blanco brillante para delimitar */
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.8);
    transition: all 0.3s ease;
}

.glass:hover {
    background: rgba(51, 65, 85, 0.95); /* Aún más claro al hacer hover (Slate 700) */
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 10px 40px -10px rgba(37, 99, 235, 0.3); /* Resplandor azulado en hover */
}

.nav-link.active {
    color: #2563eb;
    border-bottom: 2px solid #2563eb;
}

/* Ocultar scrollbar pero mantener funcionalidad */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Animaciones fluidas */
.animate-fadeIn { animation: fadeIn 0.5s ease-out forwards; }
@keyframes fadeIn { 
    from { opacity: 0; transform: translateY(10px); } 
    to { opacity: 1; transform: translateY(0); } 
}